this.find（）无法使用jQuery slideToggle

我在jsFiddle上有以下代码，无法使用seam使其工作。我希望在单击标题时显示（切换）书籍和袜子的列表。 非常感谢您的帮助。谢谢

HTML:

使用

.next（）

，因为

ul

位于您的

h2

检查这个

---

ul

不是

h2

的子元素，因此它不工作

find（）

搜索子元素。在点击处理程序中，

this

指的是没有任何

ul

子代的

h2

。请改为尝试

sibbines（）

或

next（）

。@jbabey谢谢-我不知道这只是在搜索后代

<div id="accordion">

<h2>Books</h2>

<ul>
    <li>Book 1</li>
    <li>Book 2</li>
    <li>Book 3</li>
    <li>Book 4</li>
</ul>

<h2>Socks</h2>

<ul>
    <li>Sock 1</li>
    <li>Sock 2</li>
    <li>Sock 3</li>
    <li>Sock 4</li>
</ul>
</div>

jQuery(document).ready(function(){
jQuery("#accordion").find("ul").css("display", "none");
jQuery("#accordion").find("h2").on("click", function(){
        jQuery(this).find("ul").slideToggle();
});
});

jQuery(this).next("ul").slideToggle();