nth-Child and Two class selector

I recently used nth-child() selector and two class selector.

Uses of nth-child() is simple. Just need to remember the small syntax. The below CSS will make table's row alternate in color. Table's id is poslist as used here.

#poslist tr:nth-child(even) {background: #DDD;}
#poslist tr:nth-child(odd) {background: #FFF}

I need to use this for important site. So, I went to check the support it has in different browser. I searched and found that it is not supported in (you guessed?) IE6, IE7 and IE8. So, I started looking for alternatives.

I have found that on the site I am working on has two columns and all odd number columns has common class attached to it. and I need to apply CSS on even items (LIs). So, example HTML can be like this:


<ul>
<li class="a o"></li>
<li class=a></li>
<li class="a o"></li>
<li class=a></li>
<li class="a o"></li>
<li class=a></li>
</ul>

Now, I need to find ways to apply CSS on "a" (only) classed element. I used multi (two) class selector.

li.a.o for applying to odd LIs.

li.a for applying to even LIs.

Now, what is the way to apply CSS to even class. As, if I apply CSS to LIs with a then it will be applied to all LIs?

I did like this:

li.a {} /* Apply to all */

then after that, I have written

li.a.o {} /* Remove (by overriding) from even placed LIs so that above change will apply only to even placed LIs */

I do not have option to modify HTML.