Is there a better way to write this in jQuery?

Question

$(".sectionHeader").click(function() {
    var row = $(this).parent();
    while (row.next().length != 0) {
        row = row.next();
        if (row.children().first().is('th')) return;
        row.toggle();
    }
});

Answer 1

$(".sectionHeader").click(function() {
    $(this).parent().each(function(index, element){
      if($(element).children().first().is('th')) return;
      $(element).toogle();
    });
});

Answer 2

It looks like you have rows in the table that are section headers, in that case, you can collapse until the next sectionHeader like this:

$(".sectionHeader").click(function() {
    $(this).closest("tr").nextUntil(".sectionHeader").toggle();
});

You could make it more efficient with delegate() like this:

$("#sectionTable").delegate(".sectionHeader", "click", function() {
    $(this).closest("tr").nextUntil(".sectionHeader").toggle();
});

This attaches one event handler for the entire table instead of 1 per .sectionHeader row.