Issue about changing the background image of active page in navigation bar

css

Solution

Do not go with nth-child coding, that will not help to change background image of active page. Instead of that use following CSS code:

#uiList {
    margin: 0;
    padding: 0;
    list-style-type: none;
    background:url(../m1.png);
}

#uiList a{
    display:block;
    height:195px;
    width:78px;
}
.active{
    background:url(../m1_selected.png);
}

#uiList1 {
    margin: 0;
    padding: 0;
    list-style-type: none;
    background:url(../m2.png);
}

#uiList1 a{
    display:block;
    height:195px;
    width:78px;
}
.active1{
    background:url(../m2_selected.png);
}

Html code:
<ul id="uiList">
<li><a href="#"></a></li>
</ul>
<ul id="uiList1">  
<li><a href="#"></a></li>
</ul>

Problem

We have a problem in changing the background image of active page in navigation bar. Tried many things like a:active , .active etc in css but did not work. We have used nth-child to change the background images for hover. Please help with your suggestions.

Original source