mostrare nascondere sottomenu

[dave1893]

Ciao a tutti, sono un utente nuovo e volevo chiedervi aiuto per risolvere un mio problema
Ho un menu verticale con una delle voci che contiene un sottomenu con tot sottovoci, ho bisogno che cliccando sulla voce principale il sottomenu venga mostrato e viceversa nascosto, ma il mio vero problema è che ho bisogno che, quando clicco su una di queste sottovoci, il sottomenu deve rimanere aperto, e chiudersi quando clicco su un altra voce del menu PRINCIPALE
ho trovato un js su internet che mostra e nasconde il sottomenu onclick, ma purtroppo si chide ogni volta che clicco su una delle voci del sottomenu.
Qualcuno può aiutarmi?
Grazie in anticipo a tutti
qua c' il codice html

<div class="ul_container">

<ul class="mainnav" id="nav" style="list-style:none;">

 <li><a  id="active" href="index.html"><strong>HOME</strong></a></li>

 <li><a  href="javascript:void(0)" onclick="toggleID('sub1')">COLLECTIONS</a>

	<ul class="subnav" id="sub1" style="display:none">
	<li class="first"><a href="Collections_PE_14.html">spring/summer 2014</a>
		<li class="first"><a href="Collections_PE_13.html">spring/summer 2013</a>
	<li class="first"><a href="Collections_AI_13.html">autumn/winter 2013</a>

		<li class="first"><a href="Collections_AI_12.html">autumn/winter 2012</a>
		<li class="first"><a href="Collections.html">autumn/winter 2011</a>

	</ul>

 </li>

 <li><a  href="Portrait.html">PORTRAIT</a></li>

 <li><a  href="Heritage.html">HERITAGE</a></li>

 <li><a  href="Press.html">PRESS</a></li>

 <li><a  href="Contacts.html">CONTACTS</a></li> 

</ul>

</div>

e qui c'è il js

function toggleID(IDS) {

  var sel = document.getElementById('nav').getElementsByTagName('ul');

  for (var i=0; i<sel.length; i++) { 

    if (sel[i].id != IDS) { sel[i].style.display = 'none'; }

  }

  sel = document.getElementById(IDS);

  sel.style.display = (sel.style.display != 'block') ? 'block' : 'none';

 

[criric]

Ciao, a me non si chiude
hai un esempio online ?