JavaScript : Changement de classe

Bonjour,

Je suis totalement novice en Javascript et je voudrais savoir s'il été possible de faire un changement de classe. Je m'explique. J'ai un <div> menu qui contient mon menu principal, et un <div> sous_menu qui contient les sous parties. Chaque partie dite "principale" a plusieurs sous-parties donc dans le sous menu j'ai autant de <ul> que de parties. Je voudrais que les sous-menus soient cachés en temps normal et affichés au passage de la souris sur la partie principale. Mes <ul> sont avec une classe "hidden" et je voudrais en fait les passer en class "show" au passage de la souris. Merci.

Voici le HTML :

<div id="menu">
	<ul class="niveau1">
		<li class="sousmenu"><a href="#">Accueil | </a></li>
		<li class="sousmenu"><a href="#">Pr&eacute;sentation du groupe | </a></li>
		<li class="sousmenu"><a href="#">Photographies | </a></li>
		<li class="sousmenu"><a href="#">Liens | </a></li>
		<li class="sousmenu"><a href="#">Cherbourg-Octeville | </a></li>
		<li class="sousmenu"><a href="#">Boutique | </a></li>
		<li class="sousmenu"><a href="#">Contacts | </a></li>
		<li class="sousmenu"><a href="#">Le Forum | </a></li>
	</ul>
</div>
<div id="sous_menu">
	<ul id="sous_menu_accueil" class="hidden">
		<li><a href="#"></a></li>
	</ul>
	<ul id="sous_menu_presentation" class="show">
		<li><a href="pages/#">Historique | </a></li>
		<li><a href="pages/#">Membres |</a></li>
		<li><a href="pages/#">Bureau | </a></li>
		<li><a href="pages/#">Nous contacter | </a></li>
	</ul>
	<ul id="sous_menu_photos" class="hidden">
		<li><a href="pages/#">Domicile | </a></li>
		<li><a href="pages/#">D&eacute;placement | </a></li>
	</ul>
	<ul id="sous_menu_liens" class="hidden">
		<li><a href="pages/#">Groupes de supporters | </a></li>
		<li><a href="pages/#">Le club | </a></li>
		<li><a href="pages/#">La ville | </a></li>
	</ul>
	<ul id="sous_menu_cherbourg" class="hidden">
		<li><a href="pages/#">Pr&eacute;sentation | </a></li>
		<li><a href="pages/#">&Eacute;v&eacute;nements | </a></li>
	</ul>
	<ul id="sous_menu_boutique" class="hidden">
	        <li><a href="pages/#">Produits | </a></li>
		<li><a href="pages/#">Comment acheter ? | </a></li>
	</ul>
	<ul id="sous_menu_contact" class="hidden">
		<li><a href="pages/#">Le groupe | </a></li>
		<li><a href="pages/#">Le club | </a></li>
		<li><a href="pages/#">La ville | </a></li>
	</ul>
</div>