Javascript jQuery DOM遍历

我一直在尝试将

$绑定。单击
处理程序将其绑定到同级元素，但似乎找不到正确选择要设置动画的元素的方法。下面是我正在使用的DOM树的基本结构：

<section id="a">
    <div id="b" class="foo" draggable="true">
        <header style="cursor:pointer;">1.</header>
        <p class="foo">Bar</p>
    </div>
    <div id="c" class="foo" draggable="true">
        <header style="cursor:pointer;">2.</header>
        <p class="foo">Bar</p>
    </div>
    <!-- and so on... -->
</section>

因此，为了澄清这一点，一个非常冗长的版本是：

$('div#b.foo header').click(function(){
    $('div#b.foo p.foo').slideToggle('slow');
});
$('div#c.foo header').click(function(){
    $('div#c.foo p.foo').slideToggle('slow');
});
// ...

如果这不够清楚，请让我详细说明。
您可以试试

$('header').click(function() {
    $(this).next().slideToggle('slow');
});


我通过在document ready上初始化click处理程序解决了这个问题。解决办法如下：

$(document).ready(function() {
    $('header').click(function() {
        $(this).next().slideToggle('slow');
    });
});

. 你需要澄清你的问题。
$(document).ready(function() {
    $('header').click(function() {
        $(this).next().slideToggle('slow');
    });
});