jQuery :odd and :nth-child CSS3 different
I found that jQuery :odd selector and CSS3 nth-child(odd) works different. http://jsfiddle.net/TMDwT/5/
In yellow it's CSS nth-child(odd) and if you uncomment JS and comment background: yellow in CSS you will find that it found in another way.
Can anybody say how I achieve the same result as in jQuery but with CSS3?
:odd matches the odd items within the matched elements, i.e. the contents of the jQuery object you apply the selector to,
:nth-child(odd) matches the odd items within their respective parents.
This is the same difference as between :first and :first-child, or :last and :last-child.
Update: As zzzzBov and BoltClock rightfully point out, the :odd selector is zero-based but the :nth-child() selector is one-based. This means that even if you apply the two selectors to the complete child list of an element (thus removing the difference between :odd and :nth-child(odd)), they still won't match the same elements.