Gallex Gallex - 3 months ago 8x
Javascript Question

jquery: remove submenus from menu items

simple request: remove/delete submenus from first and fourth main menu item. my not working code:

$('#main-menu ul li(:nth-child(1),:nth-child(4))').remove(.dropdown-menu);

as menu's html is quite long, i will insert here only beginning part of it, the whole is available on jsfiddle


<div id="main-menu">
<a href="#">Piirissaar</a>
<ul class="dropdown-menu">
<li><a href="#">Welcome to Your Site!</a></li>
<a href="#">Kasulik info</a>
<ul class="dropdown-menu">
<li><a href="#">Toitlustus</a></li>
<li><a href="#">Majutus</a></li>
<li><a href="#">Puhkajale</a></li>
<a href="#">Meist</a>
<ul class="dropdown-menu">
<li><a href="#">MTÜ Piirissaare Turism</a></li>


why use jq for this ? you can use css
just add :

#main-menu ul li:first-child ul,#main-menu ul li:nth-child(4) ul { 

plus i added {display:block} to #main-menu ul ul so you can see that it's working

see here jsfiddle

or if you really want to use jq , see here : jsfiddle

jq code :

$('#main-menu ul li:nth-child(1),#main-menu ul li:nth-child(4)').find('ul').remove();