I had help from someone on a topic like this one here: http://groups.google.com/group/jquery-en/browse_thread/thread/26f858bba905e523 It's not a real solution to access css properties directly but more of a work around, but here it is:
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); }); }); If anyone has any better alternative to this, I would be glad to hear it out :)