2nd level on drop down menu

[maliciousa]

I'm in the process of designing a second level to my drop down menu on my site. I'm having trouble making the 2nd level disappear. I can't seem to find what selector to use. The HTML for the menu is below:

	<div class="nav"><ul>	<li><a href="http://www.aaweb.me">Home</a></li>	<li><a href="#">About Me</a></li>	<li><a href="#">Interests</a>		<ul>				<li><a href="http://halo.aaweb.me">Halo (video game)</a></li>				<li><a href="http://www.aaweb.me/funny">Funny Web Stuff</a></li>		</ul>	</li>	<li><a href="#">News</a>		<ul>									<li><a href="#">Games</a>						<ul>							<li><a href="#">Coming Soon</a></li>						</ul>					</li>		</ul>	</li>	<li><a href="#">Projects</a>		<ul>				<li><a href="#">Canvas</a></li>				<li><a href="#">Jade's Photo Creations</a></li>		</ul>	</li>	<li><a href="java script:void" id="contact_trigger">Contact Me</a></li></ul>

I'm trying to make the <li> that says "Coming Soon" disappear and reappear when necessary, but no matter what selector I use in my CSS, I can't seem to affect the item. Could one of you awesome pro's help me out on this? I'm still a little bit new.

[jeffman]

More likely you want the parent <ul> to toggle in and out. So that would be something like

.nav ul ul li ul {   display: none;}.nav ul ul li:hover ul {   display: block;}