Marius Poiata Marius Poiata - 1 year ago 43
CSS Question

How to not toggle all menus at the same time

I'm working with Boostrap for the first time ever, please don't kill me :D
I have a problem with my navigation bar. I have 7 menus, each with a dropdown of its own. The problem is that when I click on a menu, they all dropdown at the same time, and I need only to dropdown the one I clicked on. My JS code is pretty rudimentary.
This is what I used so far:

$('.dropdown-toggle').click(function() {

And the HTML code is this, (example for one menu; each menu has a similar code):

<li class="dropdown">
<a href="#" class="dropdown-toggle">Organizare <b class="caret"></b</a>
<ul class="dropdown-menu">
<li><a href="#">Conducere</a></li>
<li><a href="#">Consiliu</a></li>
<li><a href="#">Departamente</a></li>
<li><a href="#">Administratie</a></li>
<li><a href="#">Secretariat</a></li>

What do I need to change so that only the menu I click on dropdown ?


Answer Source

Find the menu following the toggle:

$('.dropdown-toggle').click(function() {