How can I show and hide a table row using jQuery?

Question

I have a regular HTML table, how can I show and hide a table row using jQuery?

Answer 1

Either iterate the tr elements inside your table or add id's to your trs and calling the show/hide function in jQuery with that ID

Answer 2

Hides every 5th row:

$('tr:nth(5)).hide()

An example: http://jsbin.com/epeto

Answer 3

Just to add to Nuno's answer above, JQuery's toggle() function may also be useful to you

Answer 4

Also, you might want to look at the .toggle() function.

$('tr:nth(5)).toggle()

This will show/hide it and continually switch...

Answer 5

I would steer clear of the show and hide methods for table rows. They lead to bad ui effects x-browser. I have found fadeIn/Out to work much better x-browser.