Javascript 如何折叠表中所有显示的行？

我正在实现一个可折叠的表，类似于treeview的操作方式。有三个层次。在我当前的代码中，我可以扩展3个级别，但是，当我折叠第一个级别时，仍然显示级别3

当我点击关卡1时，有没有办法折叠关卡3

我的jquery是

  $(function() {
    $(".firstlevel").click(function(event) {
    $(this).(".divider").filter(".secondlevel").toggle("slow");
    });

  $(".secondlevel").click(function(event) {
    $(this).nextUntil(".secondlevel").toggle("slow");
  });
});

---

HTML和Jquery位于

向对应于行级别的每一行添加属性，例如：

<tr class="thirdlevel" data-level=3>

---

谢谢Ronald，当点击第一个“Level 2”时，这将扩展所有“Level 3”选项？哦，请再试一次，我更新了脚本。。这一次，它将只扩展其相邻的高级行，而不是全部。

$(function() {

  $("tr[data-level]").click(function(event) {
    //$(this).nextUntil(".divider").filter(".secondlevel").toggle("slow");
    var level = $(this).data('level');
    var that  = $(this);
    var siblings = $(this).toggleClass('shown').nextUntil('[data-level='+level+']:not(.divider)').filter(function(i) {
       var shown = that.hasClass('shown');
       return shown 
         ? $(this).data('level') == level + 1
         : $(this).data('level') >= level + 1;
    });//.toggle('show');

    if (that.hasClass('shown')) {
       siblings.show();
    } else {
       siblings.removeClass('shown').hide();
    }
  });
});