Well, after a while and after talking to some people, I managed to make it work. Let's hope this message gets posted before someone sees my previous and wastes time providing me some example that I no longer require (thank you though, just in case)...
CSS: div#cpblock-links a:link, div#cpblock-links a:visited, div#cpblock-links a:active { color: #ffffff; text-decoration: none; } a.cpblock-link, div#cpblock-links a:hover { color: #535f68; text-decoration: none; } JS: $('div#cpblock-links a').each(function(elem) { // if(elem == 0) { startColor = $(this).css('color'); endColor = $(this).clone(false).addClass('cpblock- link').css('color'); } $(this).mouseover(function() { $(this).css({ color: startColor }); // Little bug fix on first mouseover $(this).animate({ color: endColor }, 250); }); $(this).mouseout(function() { $(this).animate({ color: startColor }, 250); }); }); Was something like this that you had in mind Giuliano Marcangelo? Anyway, one thing I didn't really understood was what you meant by "how practical would this be". What did you mean by that? Anyway, if anyone has a better solution, more elegant I mean, without the need to clone or create elements that are not really used besides for this workaround. I would be glad to hear it out. Thanks Giuliano Marcangelo.