title: Expand collapse all divs at one time
body: <p>I am using twitter bootstrap css and js frameworks. In this example I have four collapsible divs.</p>
  
  <p>when i opened one div then I am clicking expand all button then automatically the opened div is closing.</p>
  
  <p>The way I would like to show all the divs can be expanded at a time. </p>
  
  <p>E.g. if #about is opened and the user clicks expand all button then it has to show all including with #about.</p>
  
  <p>Is there an easy way to do this?</p>
  
  <p>Here is the code:-</p>
  
  <pre><code>&lt;section id="accordion"&gt;
    &lt;a href="#_" class="expandcollapse btn btn-mini btn-primary pull-right" state="0"&gt;&lt;i class='icon-white icon-plus-sign'&gt;&lt;/i&gt; Expand All&lt;/a&gt;
      &lt;ul class="nav nav-tabs" id="tabFAQ"&gt;
         &lt;li class="active"&gt;&lt;a href="#GQ" data-toggle="tab" state="0"&gt;Subscriptions&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
      &lt;div class="tab-content" id="faqContent"&gt;
        &lt;div class="tab-pane active" id="GQ"&gt;
          &lt;div class="accordion" id="generalQuestions"&gt;
            &lt;div class="accordion-group"&gt;
              &lt;div class="accordion-heading clearfix"&gt;
                  &lt;label class="checkbox pull-left accordion-margin"&gt;         
                      &lt;input type="checkbox" id="Tactial"&gt;
                  &lt;/label&gt;          
                  &lt;a class="accordion-toggle category pull-left" data-toggle="collapse" data-parent="#parent" href="#category1"&gt;5.11 Tactial&lt;i class="icon-ok-sign success-color"&gt;&lt;/i&gt;
                  &lt;/a&gt;
  &lt;span class="tooltip-demo pull-left"&gt;&lt;a class="accordion-toggle category" data-original-title="push special discount offer to the retailer" rel="tooltip" data-placement="right" href="#"&gt;(Push Special Discount)&lt;/a&gt;&lt;/span&gt;
  &lt;div data-toggle="collapse" data-parent="#parent" href="#category1" class="head-height"&gt;&amp;nbsp;&lt;/div&gt;
  
  
              &lt;/div&gt;&lt;!--/accordion-heading--&gt;
              &lt;div id="category1" class="accordion-body collapse"&gt;
                &lt;ul class="accordion-inner unstyled"&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;        
                          &lt;input type="checkbox" id="Women"&gt;
  
                      &lt;a href=""&gt;Women&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;
  
                          &lt;input type="checkbox" id="Customer-Is-Anonymous"&gt;
  
                      &lt;a href=""&gt;Men&lt;/a&gt;
                  &lt;/li&gt;
                &lt;/ul&gt;
              &lt;/div&gt;&lt;!--/Apparel End--&gt;
            &lt;/div&gt;
            &lt;div class="accordion-group"&gt;
              &lt;div class="accordion-heading clearfix"&gt;
                  &lt;label class="checkbox pull-left accordion-margin"&gt;         
                          &lt;input type="checkbox" id="Juary" class="regular-checkbox"&gt;&lt;label for="Juary"&gt;&lt;/label&gt;
                  &lt;/label&gt;
                  &lt;a class="accordion-toggle category pull-left" data-toggle="collapse" data-parent="#parent" href="#category2"&gt;Juary&lt;/a&gt;
                  &lt;span class="tooltip-demo pull-left"&gt;&lt;a class="accordion-toggle category" data-original-title="push special discount offer to the retailer" href="#" rel="tooltip" data-placement="right"&gt;(Push Special Discount)&lt;/a&gt;&lt;/span&gt;
                  &lt;div data-toggle="collapse" data-parent="#parent" href="#category2" class="head-height"&gt;&amp;nbsp;&lt;/div&gt;
  
              &lt;/div&gt;&lt;!--/accordion-heading--&gt;
               &lt;div id="category2" class="accordion-body collapse"&gt;
                &lt;ul class="accordion-inner unstyled"&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;        
                          &lt;input type="checkbox" id="Furniture"&gt;
                  &lt;a href=""&gt; Furniture (Subscribed) &lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;        
                          &lt;input type="checkbox" id="Accessories"&gt;
                  &lt;a href=""&gt;Home Accessories&lt;/a&gt;
                  &lt;/li&gt;
                &lt;/ul&gt;
              &lt;/div&gt;
  
            &lt;/div&gt;
            &lt;div class="accordion-group"&gt;
              &lt;div class="accordion-heading clearfix"&gt;
                  &lt;label class="checkbox pull-left accordion-margin"&gt;         
                          &lt;input type="checkbox" id="Dickies" class="regular-checkbox"&gt;&lt;label for="Dickies"&gt;&lt;/label&gt;
                  &lt;/label&gt;
                  &lt;a class="accordion-toggle category pull-left" data-toggle="collapse" data-parent="#parent" href="#category3"&gt;Dickies&lt;/a&gt;
                  &lt;span class="tooltip-demo pull-left"&gt;&lt;a class="accordion-toggle category" data-original-title="push special discount offer to the retailer" href="#" rel="tooltip" data-placement="right"&gt;(Push Special Discount)&lt;/a&gt;&lt;/span&gt;
                  &lt;div data-toggle="collapse" data-parent="#parent" href="#category3" class="head-height"&gt;&amp;nbsp;&lt;/div&gt;
  
              &lt;/div&gt;&lt;!--/accordion-heading--&gt;
               &lt;div id="category3" class="accordion-body collapse"&gt;
                &lt;ul class="accordion-inner unstyled"&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;        
                          &lt;input type="checkbox" id="Shoe"&gt;
                  &lt;a href=""&gt;Shoe&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;    
                          &lt;input type="checkbox" id="Swaters"&gt;
                  &lt;a href=""&gt;Swaters&lt;/a&gt;
                  &lt;/li&gt;
                &lt;/ul&gt;
              &lt;/div&gt;
  
            &lt;/div&gt;
            &lt;div class="accordion-group"&gt;
              &lt;div class="accordion-heading clearfix"&gt;
                  &lt;label class="checkbox pull-left accordion-margin"&gt;         
                          &lt;input type="checkbox" id="Puma" class="regular-checkbox"&gt;&lt;label for="Puma"&gt;&lt;/label&gt;
                  &lt;/label&gt;
                  &lt;a class="accordion-toggle category pull-left" data-toggle="collapse" data-parent="#parent" href="#category4"&gt;Puma&lt;/a&gt;
                  &lt;span class="tooltip-demo pull-left"&gt;&lt;a class="accordion-toggle category" data-original-title="push special discount offer to the retailer" href="#" rel="tooltip" data-placement="right"&gt;(Push Special Discount)&lt;/a&gt;&lt;/span&gt;
               &lt;div data-toggle="collapse" data-parent="#parent" href="#category4" class="head-height"&gt;&amp;nbsp;&lt;/div&gt;   
  
              &lt;/div&gt;&lt;!--/accordion-heading--&gt;
               &lt;div id="category4" class="accordion-body collapse"&gt;
                &lt;ul class="accordion-inner unstyled"&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;        
                          &lt;input type="checkbox" id="Appearel"&gt;
                  &lt;a href=""&gt;Appearel&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;
                          &lt;input type="checkbox" id="Sports"&gt;
                  &lt;a href=""&gt; Sports&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;
                          &lt;input type="checkbox" id="Spickes"&gt;
                  &lt;a href=""&gt; Red Spickes Shoe&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li id="" class="sidelink clearfix"&gt;
                          &lt;input type="checkbox" id="Soccer"&gt;
                  &lt;a href=""&gt; Soccer Shoe&lt;/a&gt;
                  &lt;/li&gt;
                &lt;/ul&gt;
              &lt;/div&gt;
  
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
          &lt;/section&gt;
  
  
  //collapsible menu
   $('#tabFAQ a').click(function(e) {
          e.preventDefault();
          $(this).tab('show');
      })
  
      $('.expandcollapse').click(function() {
  
          var newstate = $(this).attr('state') ^ 1,
              icon = newstate ? "minus" : "plus",
              text = newstate ? "Collapse" : "Expand";
  
          $('.nav-tabs').children().each(function(index) {
              if($(this).hasClass('active')) {
                  var tab = $(this).children(':first');
                  toggleTab(tab.prop('hash'));
                  tab.attr('state',newstate);
              }
          });
  
          $(this).html("&lt;i class=\"icon-white icon-" + icon + "-sign\"&gt;&lt;/i&gt; " + text +" All");
  
          $(this).attr('state',newstate)
  
      });
  
      $('a[data-toggle="tab"]').on('shown', function (e) {
  
          var myState = $(this).attr('state'),
              state = $('.expandcollapse').attr('state');
  
          if(myState != state) {
            toggleTab($(this).prop('hash'));
            $(this).attr('state',state);
          }
  
      })
  
      function toggleTab(id){
  
          $(id).find('.collapse').each(function() {
              $(this).collapse('toggle');
            });
  
      }
  </code></pre>