jQuery Zebra selector

I have a CSS class called grid which I place on my tables. I want to Zebra strip my even rows so I use the following jQuery code

This basically says “Apply the css class even to any tr tag which has a parent (at any level) with a class of grid.” The problem with this is when I have nested tables, the child table’s tr tags will also get the even style. Since I did not specify the child table with a class of grid, I don’t want it to pick up the zebra stripe.

How can I specify to only apply the even class on tr tags which are a direct descendant of the tag which has the grid class?

Asked on April 7, 2016 in jQuery.
Add Comment
1 Answer(s)

There’s a great jQuery blog post that you might find useful:
Zebra Table Showdown.

This post also includes an interesting discussion of how to do zebra striping in most of the other major JavaScript libraries.

Scroll down to see comments on adding hover effects to your zebra striping using jQuery.

Answered on April 7, 2016.
Add Comment

Your Answer

By posting your answer, you agree to the privacy policy and terms of service.