Remove link on parent li only with jQuery -


i have created following code nested ul shows , hides jquery when click on parent li.

the problem markup generated dynamically, , disable anchor links on parent links only, , have links in nested ul list active.

i have tried return false, disables links. how can disable parent li's?

also menu should not expand/collapse when child li's clicked.

i have following markup....

<nav class="shop-cat"> <ul id="menu-shop-categories" class="menu">     <li><a href="">clothing</a>         <ul class="sub-menu">             <li><a href="">t-shirts</a></li>             <li><a href="">sweatshirts</a></li>             <li><a href="">hoodies</a></li>         </ul>     </li>     <li><a href="">art</a>         <ul class="sub-menu">             <li><a href="">canvas</a></li>             <li><a href="">prints</a></li>         </ul>     </li>     <li><a href="">accessories</a>         <ul class="sub-menu">             <li><a href="">glasses</a></li>             <li><a href="">keyrings</a></li>         </ul>     </li> </ul> </nav> 

with jquery...

$('#menu-shop-categories > li').click(function() {     $(this).find('.sub-menu').slidetoggle(400);     return false;      }); 

here codepen also... http://codepen.io/anon/pen/ieihc

set click on anchor instead of li

$('#menu-shop-categories > li > a').click(function(e) {     e.preventdefault();     $(this).siblings('.sub-menu').slidetoggle(400);  }); 

demo


Comments

Popular posts from this blog

python - How to create a legend for 3D bar in matplotlib? -

java - Multi-Label Document Classification -

php - Dynamic url re-writing using htaccess -