jquery - Jquery Animated File Tree - 各高さを自動に移行する方法

Question

私は現在、css と jquery を使用してアニメーション化されたツリー構造の基本的なコードを持っていますが、jquery に関する知識が限られているため、議論に問題があります。以下を参照してください。3 行目で、li のクラスが展開されている場合、li を開閉するトランジションを追加すると言っています。私のデモを試してみると、ツリー内の個々の li ではなく、最上位の li では機能することがわかります。すべてのliを同じように扱うのではなく、構造内のliが展開されているかどうかをjQueryで解決できる方法はありますか? ありがとうございました

$(function () {
    $("li").click(function () {
        var expanded = $(this).is(".expanded");
        if (expanded) 
        {
            $(this).transition({ 'max-height': '20px', overflow: 'hidden' }, 500, 'in', function () {$(this).removeClass("expanded"); });
        } 
        else 
        {
            $(this).transition({ 'max-height': $(this).get(0).scrollHeight, overflow: ''}, 500, 'out', function () { $(this).addClass("expanded"); });
        }
    });
});