I want to traverse all individual li by using only one parent class eg: "here we using mainDiv" How can we do this in css3? not in Jquery or javascript.

```
css:
    .mainDiv ul li:nth-child(1){
       color:red;
    }
   .mainDiv ul li:nth-child(2){
           color:blue;
        }
   .mainDiv ul li:nth-child(3){
           color:yellow;
        }

```

> 
> kindly mention below code
> 
> 
> 

Like wise i want to traverse the second set of ul > li (a,b,c) by using only one parent class name (mainDiv). How can i do this by css3?

HTML:

```
 <div class="mainDiv">

    <ul>
    <li>x</li>
    <li>y</li>
    <li>z</li>
</ul>

<ul>
    <li>a</li>
    <li>b</li>
    <li>c</li>
</ul>

</div>

```