使用切换点击和元素并显示/隐藏它下面的元素？

Question

我有以下结构：

我要让ul.children节目，并通过单击另一个像上面（酒吧）隐藏。

它应该只显示/隐藏下面的一个，因为页面充满了具有相同结构的无序列表。

所以我坚持在这里：

$('#wpbdp-categories > .wpbdp-categories > li.cat-item > a').click(function() { 
    ??? 
}); 

有什么建议？

Answer 1

$('#wpbdp-categories > .wpbdp-categories > li.cat-item > a').click(function() { 
    $(this).siblings("ul.children").toggle(); 
}); 

应该工作，我认为

Answer 2

尝试使用.next()

例如

$(this).next('.children').toggle(); 

Answer 3

$('#wpbdp-categories > .wpbdp-categories > li.cat-item > a').toggle(
    function() { $(this).next().show() }, 
    function() { $(this).next().hide() } 
); 

最简单的方法..

编辑：

.toggle()处理click事件，这样你们不需要定义一个click事件吧。

http://api.jquery.com/toggle-event/

的.toggle（）方法结合的Click事件处理程序，所以规则 概述了点击的触发同样在此适用。