html - How to randomly assign a color on hover effect -

i've never seen hover effect before, , i'm trying understand how it's achieved. you'll notice in example, when user hovers on link, color link turns can any 1 one of 5 colors assigned within style sheet (see below) @ random. how create hover effect? can done purely css?

a:hover {   color:#1ace84;   text-decoration: none;   padding-bottom: 2px;   border: 0;   background-image: none;   }  a.green:hover { color: #1ace84; } a.purple:hover { color: #a262c0; } a.teal:hover { color: #4ac0aa; } a.violet:hover { color: #8c78ba; } a.pink:hover { color: #d529cd; } 

since random factor introduced, don't think there's way of doing purely css.

here's simple approach problem, using jquery.

you can see working example here: http://jsfiddle.net/gngjz/1/

$(document).ready(function() {     $("a").hover(function(e)     {         var randomclass = getrandomclass();         $(e.target).attr("class", randomclass);     }); });  function getrandomclass() {     //store available css classes     var classes = new array("green", "purple", "teal", "violet", "pink");      //get random number 0 4     var randomnumber = math.floor(math.random()*5);      return classes[randomnumber]; }