Css Code Is Not Working

I want that when I work on any of the navigation button it will be color red,while the others will be the same color..Here I have the jstl tag..thats why it is not working in jsfid

Solution 1:

When you click on the link you:

1. Start some JS
2. Modify the DOM of the current page to change the class
3. Finish running the JS
4. Follow the link
5. Discard the DOM you just modified
6. Load a new page with a new DOM

If you want to change the classes on the link in the new page, you have to do it either:

• Before sending the page to the client (this could be with server side code or hardcoded into static HTML)
• By checking the location with JavaScript, finding the matching href and then modifying that element.

Solution 2:

There are a couple of places that you need to change as a starting point. First in the html, change current to active

<li><ahref="..."class="active">Home</a></li>

and in JS,

$(document).ready(function(e) {   
    $("ul li a").click(function(){
        $("ul li a").removeClass("active");
        $(this).addClass("active");
    });
});

jsfiddle