title: Trivial JavaScript / Bootstrap dropdown issue
body: <p>Basically what I have is 3 dropdown menus, and I need only one to be active, so that when I choose something from it, the rest should become active as well. So what I've done so far is I've added the disabled class and now I have the first one active, while the  rest 3 - disabled. My question is - how to make them active as soon as I choose something from the first dropdown</p>
  
  <pre><code> $(document).ready(function () {
  
          $('#Test #firstId .dropdown-menu li a').click(function () {
              var selText = $(this).text();
              $(this).parents('.btn-group').find('.dropdown-toggle').html(selText + ' &lt;span class="caret"&gt;&lt;/span&gt;')
          });
  
          $('#Test #secondId .dropdown-menu li a').click(function () {
              var selText = $(this).text();
              $(this).parents('.btn-group').find('.dropdown-toggle').html(selText + ' &lt;span class="caret"&gt;&lt;/span&gt;')
          });
  
          $('#Test #thirdId .dropdown-menu li a').click(function () {
              var selText = $(this).text();
              $(this).parents('.btn-group').find('.dropdown-toggle').html(selText + ' &lt;span class="caret"&gt;&lt;/span&gt;')
          });
          $('#Test #fourthId .dropdown-menu li a').click(function () {
              var selText = $(this).text();
              $(this).parents('.btn-group').find('.dropdown-toggle').html(selText + ' &lt;span class="caret"&gt;&lt;/span&gt;')
          });
  
      });
  </code></pre>
  
  <p>And here are my dropdowns:</p>
  
  <pre><code> &lt;div class="btn-group" id="firstId"&gt;
                              &lt;button class="btn btn-default dropdown-toggle" type="button"
                                      data-toggle="dropdown"&gt;
                                  Store
                                  &lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
                              &lt;ul class="dropdown-menu" role="menu" aria-labelledby="menu1"&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;3&lt;/a&gt;
                                  &lt;/li&gt;
                                  &lt;li role="presentation" class="divider"&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;About Us&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-3"&gt;
                      &lt;div class="dropdown"&gt;
                          &lt;div class="btn-group" id="secondId"&gt;
                              &lt;button class="btn btn-default dropdown-toggle disabled" type="button"
                                      data-toggle="dropdown"&gt;
                                  Catalog
                                  &lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
                              &lt;ul class="dropdown-menu" role="menu" aria-labelledby="menu1"&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;3&lt;/a&gt;
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-3"&gt;
                      &lt;div class="dropdown"&gt;
                          &lt;div class="btn-group" id="thirdId"&gt;
                              &lt;button class="btn btn-default dropdown-toggle disabled" type="button"
                                      data-toggle="dropdown"&gt;
                                  Categories
                                  &lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
                              &lt;ul class="dropdown-menu" role="menu" aria-labelledby="menu1"&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;3&lt;/a&gt;
                                  &lt;/li&gt;
                                  &lt;li role="presentation" class="divider"&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-3"&gt;
                      &lt;div class="dropdown"&gt;
                          &lt;div class="btn-group" id="fourthId"&gt;
                              &lt;button class="btn btn-default dropdown-toggle disabled" type="button"
                                      data-toggle="dropdown"&gt;
                                  Products
                                  &lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
                              &lt;ul class="dropdown-menu" role="menu" aria-labelledby="menu1"&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;3&lt;/a&gt;
                                  &lt;/li&gt;
                                  &lt;li role="presentation" class="divider"&gt;&lt;/li&gt;
                                  &lt;li role="presentation"&gt;&lt;a role="menuitem" tabindex="-1" href="#"&gt;4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  </code></pre>