Jquery 通过单击打开/关闭子菜单

我想在您单击一个li时创建一个菜单，该li使儿童可以使用class.navi子菜单来激活该类。。那么它是可见的。。它起作用了。。但是如果我点击一个秒的时间，它不会再关闭。。。我认为这个说法是错误的。。你能帮我吗

$("#main-navi ul li").click(function(event){
    event.preventDefault(); 

    var i = $(this).children(".navi-submenu");

    if(i.hasClass("active")){
        i.removeClass("active");
    }else{
        i.addClass("active");
    }
});

尝试使用toggleClass（）

我将函数children（）改为find（），对我来说这感觉更可靠，因为它感觉children（）查找直接的子元素，而find（）查找自身内部的每个元素。顺便说一句，这并不是基于实际情况，我想这只是一种偏好/直觉。

尝试使用toggleClass（）

---

我将函数children（）改为find（），对我来说这感觉更可靠，因为它感觉children（）查找直接的子元素，而find（）查找自身内部的每个元素。顺便说一句，这并不是基于实际情况，我猜只是一种偏好/直觉。

我尝试过它，它比第一个好，因为它较短，但它添加了类，并且在第二次单击后不会删除它。。。我不知道为什么：（我试过了，它比第一个好，因为它比较短，但是它添加了类，并且在点击secound后没有删除它…我不知道为什么：(

$("#main-navi ul li").click(function(event){ event.preventDefault();
 $(this).find(".navi-submenu").toggleClass('active');
});