jquery / javascript：如何从父元素的所有子元素中删除“活动”类？

Question

I have a few lists, something like so:

<div id="menu" class="divclass">
    <ul id="firstlist">
        <li><a href='#'>...</a></li>
        <li><a href='#'>...</a></li>
        <li><a href='#'>...</a></li>
    </ul>
    <ul id="secondlist">
        <li><a href='#'>...</a></li>
        <li><a href='#'>...</a></li>
        <li><a href='#'>...</a></li>
    </ul>
    <!-- etc. - similar unordered lists follow. -->
</div>

When one of the <a> elements is clicked, I want to clear all the <li> elements of its list of the 'active' class. I've been fiddling around with .parent() , .children() , and .removeClass('active') but I think I'm totally missing something because I can't get it to work. Can anyone give me a hand? This is the beginning of the script:

$(document).ready(function() {
    $(".divclass ul li a").click(function() { ... }}

where .divclass is the class of the div that contains the unordered lists.

Answer 1

Remove all

$(".divclass ul li a").click(function() {
    $(this).closest('.divclass').find('li').removeClass('active');
}};

Remove only form the same list

$(".divclass ul li a").click(function() {
    $(this).closest('ul').find('li').removeClass('active');
}};

If you also want to add the class active to the li parent of the a clicked:

$(".divclass ul li a").click(function() {
    $(this).parent().addClass('active').siblings().removeClass('active');
}};

Answer 2

You can use:

 $("#menu a").click(function() {
    //to remove class active from li elements
    $(this).closest('ul').find('.active').removeClass('active');


    //to remove li with active class
    $(this).closest('ul').find('.active').remove();
 });