Using only HTML and CSS.
HTML
<ul id="menu">
<li><a href="SOME_LINK">Some menu without sub-menu</a></li>
<li><a href="SOME_LINK2">Some menu without sub-menu 2 </a></li>
<li>Some menu WITH sub-menu
<ul>
<li><a href="SOME_LINK">Some sub-menu</a></li>
<li><a href="SOME_LINK">Some sub-menu 2</a></li>
</ul>
</li>
<li><a href="SOME_LINK3">Some menu without sub-menu 3</a></li>
</ul>
CSS
ul>li>ul{display:none}
ul>li:hover>ul, ul>li:selected>ul{display:block}
JS (jQuery) to OPEN all submenus
$('#menu li>ul').parent().addClass('selected');
JS without Jquery
var menus = document.getElementById('menu').getElementsByTagName('li')
for(var row in menus){
if(typeof menus[row] == 'object' && menus[row].getElementsByTagName('ul').length > 0){
menus[row].getElementsByTagName('ul')[0].className = 'selected';
}
}