在下拉期间动态更改列表图标

Question

我有一个下面结构的多层列表。我知道如何以动态方式更改图标，但由于列表的结构，顶级分层列表不会动态更改。我需要一种方法来引用p class ='handle'上的click事件的第一个ul。完整设置JSfiddle http://jsfiddle.net/Gwbfd/

$(document).ready(function(){
    $('.drawer').hide();
    $('.handle').click(function(){
        $(this).parent().children().not(this).slideToggle('slow');
    });
});

我需要的是对父ul的引用。

列表结构是UL LI P（可点击）UL LI P（可点击的第二层）

当我点击<P>时，我无法获得第一个UL更改。后续的将改变

像

这样的东西

$(this).parent().toggleClass('expanded');

Answer 1

尝试使用.closest('ul')这将为您提供匹配ul选择器的第一个祖先。这是一个轻微更新的fiddle，但我认为你应该更多地整理html。