active class javascript

Question

I have used the following code to display menu

<ul id="menu">
    <li id="11"><a href="#1" class="cross-link cross-link1">Start a League</a><span></span></li>
    <li id="12"><a href="#2" class="cross-link cross-link1">Roster Settings</a><span></span></li>
    <li id="13"><a href="#3" class="cross-link cross-link1">Draft Settings</a><span></span></li>
    <li id="14"><a href="#4" class="cross-link cross-link1">Transaction Settings</a><span></span></li>
    <li id="15"><a href="#5" class="cross-link cross-link1">Playoff Settings</a><span></span></li>
    <li id="16"><a href="#6" class="cross-link cross-link1">Launch Your League!</a><span></span></li>
</ul>

If I click any menu the class active should be added in that particular li. How can i do it with javascript.

Benoit Blanchon · Accepted Answer · 2012-01-28 12:06:53Z

7

Using jQuery:

$("li").click(function() {
    $("li").removeClass("active");
    $(this).addClass("active");
});

I supposed that you only wanted a single <li> with the active class.

Demo: http://jsfiddle.net/j9qTE/1/

edited Jan 28, 2012 at 12:06

answered Jan 28, 2012 at 12:01

Benoit Blanchon

14.7k5 gold badges80 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

active class javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related