Table Row Odd/Even Reset

Question

I am using this:

jQuery("tr:odd").css("background-color", "#f5f5f5");
jQuery("tr:even").css("background-color", "#ececec");

Just simply adding a background color to alternating table rows, which works fine. The problem is that if there are multiple tables in the same page, it just keeps iterating down each table instead of resetting for each table and starting new. My th background color is the same color as my even rows So eventually it catches up and I have a th and tr that are the same color so it looks like one big row.

How can I use those two lines of jquery, but make it start over for each table on the page if there are multiple tables?

Answer 1

Start by selecting the tables, then finding the child rows:

jQuery("table").find("tr:odd").css("background-color","#f5f5f5");

http://jsfiddle.net/mblase75/xgQ8Q/

Vega's answer uses the same approach with fewer characters.