Question

For the table below, all cell under row2 (tr class="row2") is empty, how to check the row with empty cell and only hide (display: none) it?

<table>
<tr class="row1">
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
<tr class="row2">
<td></td>
<td></td>
<td></td>
</tr>
...
<tr class="row100">
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
</table>

Answer 1

With the following jQuery script you will loop through all table rows, check all their colums and see if any of them is not empty.

If none of them is not empty it will hide the row.

$('table tr').each(function(){

    var hide = true;
    $('td',this).each(function(){

        if($(this).html() != '')
            hide = false;

    });

    if(hide)
        $(this).hide();

});

Excuse me, it’s supposed to be .html() not .val()

Here is a jsfiddle example: http://jsfiddle.net/dYkLg/

Here is a shorter version actually, this works by checking if the amount of empty colums is equal to the total amount of colums within that row directly checking if there are any non-empty colums in the current row:

$('table tr').each(function(){

    if(!$('td:not(:empty)',this).length)
        $(this).hide();

});

Updated thanks to Tom Hubbard

With the jsfiddle: http://jsfiddle.net/dYkLg/2/