Jquery Parents not working for multiple divs

Question

I am trying to hide the parent div of a table of all the checkbox are unchecked in the table

My jquery looks like

    $('table.result_grid tbody')
    .filter(function() {
     allChecked = false;
     $(this).find(':checkbox')
                        .each(function(index) {
                            allChecked = allChecked || $(this)[0].checked;
                        })
     return !allChecked;
 })
 .parents('div:eq(1)')
 .hide()

The above code works if i have just one tbody but it fails if i have more then one tbody. i am not sure what the correct way of doing this.

Answer 1

You have to iterate over all elements and hide their parents there.

$('table.result_grid tbody')
.filter(function() {
    allChecked = false;
    $(this).find(':checkbox')
    .each(function(index) {
         allChecked = allChecked || $(this)[0].checked;
    })
    return !allChecked;
}).each(function () {
    $(this).parents('div').hide();
});