如何在下一个ul中添加和删除一个类？

Question

Following my previous question答案被接受，我现在处于不同的情况，其中html如下。我想要做的是点击其父锚子项

时相同的，打开/关闭嵌套的uls

HTML

<ul>
  <li><a href="">Text</a>
     <ul class="closed">
        <li><a href="">Two</a>
           <ul class="closed">
              <li><a href="">Three</a>
                <ul class="closed">
                   <li><a href="">Four</a></li>
                </ul>
              </li>
           </ul>
         </li>
     </ul>
   </li>
</ul>

CSS

.closed {
   display: none;
}

.opened {
   display: block;
}

不工作JS我试过：

$("a").on("click", function(e) {
    e.preventDefault();
    $(this).parent().next("ul").toggleClass("closed opened");
});

没有任何事情发生，也没有错误。

Answer 1

知道了。这是因为类的优先级顺序低于style属性。切换我的CSS顺序：

.opened {
   display: block;
}

.closed {
   display: none;
}