如何添加和刪除類到下一個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; 
}