我如何使ul，li与JQuery可折叠？

Question

我的列表如下：

因此，文件夹的类别为parent，文件的类别为child。

我已经尝试了一些方法，并在stackoverflow上找到了其他方法。 喜欢：

$('.child').hide();
$('.parent').click(function() {
    $(this).find('ul').slideToggle();
});

如果文件夹之外还有其他文件夹，则此方法很好。问题是我在其他文件夹中有文件夹，因此无法正常工作。

我该如何实现？

Answer 1

希望它可以解决您的问题。

$('.child').hide();
$('.parent').click(function(e) {
e.stopPropagation();
    $(this).children('ul').slideToggle();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li class="parent">
    Parent
    <ul class="child">      
      <li class="parent">
        Parent
        <ul class="child">
            <li>child</li>
        </ul>
      </li>
    </ul>
  </li>
  <li class="parent">
    Parent
    <ul class="child">      
      <li class="parent">
        Parent
        <ul class="child">
            <li>child</li>
        </ul>
      </li>
    </ul>
  </li>
  <li class="parent">
    Parent
    <ul class="child">      
      <li class="parent">
        Parent
        <ul class="child">
            <li>child</li>
        </ul>
      </li>
    </ul>
  </li>
  <li class="parent">
    Parent
    <ul class="child">      
      <li class="parent">
        Parent
        <ul class="child">
            <li>child</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>