jQuery hide rows from table

Question

I am new using jQuery, and I am trying to hide rows from a table like that:

<table border="1" width="100%" id="table1">
        <tr>
            <td style="text-align: center">
            First Row   
            </td>
        </tr>

        <tr>
            <td style="text-align: center">
            Second row  
            </td>
        </tr>
        <tr>
            <td style="text-align: center">
            Thrid row   
            </td>
        </tr>
</table>

I am trying to hide the first and the 3erd row from table, how can I do it? I am trying but I cannot achieve my goal with this code:

$('#table1 tr').hide()

$('#table1 tr:first(), #table1 tr:eq(2)').hide(), or ` #table1 tr:last()` if it's always going to be the last row. — Ohgodwhy
– Ohgodwhy, Commented Jul 24, 2013 at 2:07
What is the expected and actual behavior of the code you provide? — ameed
– ameed, Commented Jul 24, 2013 at 2:24

nnnnnn · Accepted Answer · 2013-07-24 02:16:33Z

5

There are numerous ways to do this. Here's one:

$("#table1 tr:even").hide();

Noting that row indexes are zero-based, so the first and third rows are "even". Of course this hides all even rows but your example only has three rows.

To explicitly target individual rows by (zero-based) index:

var $rows = $("#table1 tr");
$rows.eq(0).hide();
$rows.eq(2).hide();

Or, if you have control over the html you can add a class to whichever rows you want to hide and select based on the class.

edited Jul 24, 2013 at 2:16

answered Jul 24, 2013 at 2:10

nnnnnn

150k30 gold badges210 silver badges247 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery hide rows from table

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related