Tables with at least 20 rows are more readable when its rows look like stripes – even row in one color, odd one in another. Before jQuery we used to add class to each row of table, we made "<tr class="even"> …</tr>" and "<tr class="odd"> …</tr>". Now it’s much easier to do using jQuery.

Source data:

Html-code of table:


CSS styles for table

To make striped table, we need to add jQuery to a page and add some code:


You can make user decide whether he wants to colorize table by himself. In this case you need to add button "Colorize table" and add action "$("table tr:nth-child(even)").addClass("striped");" for it.




# Name Age
1 Alexey 34
2 Mark 8
3 Dina 35
4 Marta 6
5 Dana 7