Toggle siblings with jquery

Question

У меня проблемы с toggle() в jquery. См. http://jsfiddle.net/rch7L/. При нажатии на заголовок уровня 1 он делает именно то, что должен, но при нажатии на заголовок уровня 2 он открывает все строки уровня 3, а не только строки уровня 3 под заголовком уровня 2.

$('tr.level-2, tr.level-3').css("display", "none"); 

$("tr.level-1").click(function(){ 
    $(this).siblings('tr.level-2').toggle(); 
}); 

$("tr.level-2").click(function(){ 
    $(this).siblings('tr.level-3').toggle(); 
}); 

Я попытался с помощью братьев и сестер(), но это не то, что я хочу, щелкая заголовки уровня 2.

Answer 1

Просто используйте .nextUntil() методу

LIVE DEMO

$("tr.level-2").click(function(){ 
    $(this).nextUntil('tr.level-2').toggle(); 
});