JQuery颜色变化动画（UI switchClass）

Question

I have a website that contains a number of projects and each project is assigned a Category. There can be more than one category per project. Some projects may be "Advertising" and "Exhibition"

I've used PHP to build the links to each project and they appear as such:

<a class='Advertising Exhibition'>Project Name</a>

This way I can assign multiple classes to each project.

Now, for my problem. I want to be able to click "Advertising" in the navigation and for any projects with the class Advertising to fade to red to highlight them. Here is my code:

//In the Head
<script>
function changeCat(cat){
    $('.'+cat).animate({color:'#ef2f24'}, 500);
}
</script>

//In the Navigation
<a href="#" class="Advertising" onclick="changeCat('Advertising')">Advertising</a>

//In the Body
<a href='project.php?name=projectname' class='Advertising Exhibition'>Project Name</a>

The animate doesn't seem to want to work. In theory clicking on Advertising should highlight all Advertising projects to the colour #ef2f24 over the course of 500 milliseconds.

Can anybody help?

Answer 1

It might be more convenient to use a classChange animation like described over here: jQuery.animate() with css class only, without explicit styles