Onclick remove div class specifically does not work jquery function

$(".side-nav-toggle").click(function() {
    $("body").toggleClass("side-nav-open");
});

$(".nav-level-back").click(function() {
    $(".nav-links-container").removeClass("open");
    $(".nav-level-2").removeClass("open");
});
$(".nav-links li").click(function() {
    $(".nav-links-ontainer").addClass("open");
    $(this).children('div').addClass('open');
});

I wrote this jquery for navigation purpose , addclass works fine but when i want to remove addedclasses from divs removeClass function not working . When i trigger remove class function it highlights those targeted div but didnt remove class from it ,

kindly see this link http://picpaste.com/helpp-Nkc9zDIU.png

html

Hi I have figured it out i.e the cause. Its related to hierarchy of HTML elements, You are adding open class on click of li, and removing class on click of back link. But the back link is within li. So when you click on back link, jQuery first removes open class and then since li is also clicked, it adds again. Check it using alerts

$(".side-nav-toggle").click(function() {
    $("body").toggleClass("side-nav-open");
});

$(".nav-level-back").click(function() {alert("Back link clicked remove class");
    $(".nav-links-container").removeClass("open");
    $(".nav-level-2").removeClass("open");
});
$(".nav-links li").click(function() {alert("Add class open");
    $(".nav-links-ontainer").addClass("open");
    $(this).children('div').addClass('open');
});
Hello, buddy!稿源:Hello, buddy! (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 前端开发 » Onclick remove div class specifically does not work jquery function

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录