CSS Selector Problem

I have the following html structure

<div>
<ul>
<li>
<a href="...">I'm a level 1 link</a>
<ul>
<li>
<a href="...">I'm a level 2 link</a>
<li>
</ul>
</li>
</ul>
</div>

I want to have a web application that allows the end user to build up their
style sheet by selecting colours etc and seeing what affect this has on the
above html.

So, someone might want level 1 links to appear one way and level 2 links to
appear another.

How this happens is as follows:

They select a colour for each and these values get sent to the page
containing the above html as parameters within the request object. Code: