Question

41

add/remove active class for ul list with jquery?

rated 0 times [ 42] [ 1] / answers: 1 / hits: 126849 / 11 Years ago, sun, november 24, 2013, 12:00:00

I'm trying to remove and set an active class for a list item every time it's clicked. It's currently removing the selected active class but isn't setting it. Any idea what I'm missing?

HTML

<ul class=nav nav-list>

  <li class='nav-header'>Test</li>

  <li class=active><a href=page1.php>Page 1</a></li>

  <li><a href=page2.php>Page 2</a></li>

  <li><a href=page3.php>Page 3</li>

</ul>

jquery:

 $('.nav-list').click(function() {



    //console.log(Clicked);

    $('.nav-list li.active').removeClass('active');

    $(this).addClass('active');

});

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

nikhilh

Add To Favorites

Follow

Total Points: 224

Total Questions: 89

Total Answers: 99

Location: Bahrain

Member since Fri, Sep 16, 2022

2 Years ago

answered 11 Years ago hallie · Accepted Answer

this will point to the <ul> selected by .nav-list. You can use delegation instead!

$('.nav-list').on('click', 'li', function() {

    $('.nav-list li.active').removeClass('active');

    $(this).addClass('active');

});