title: Bootstrap Accordion not collapsing?
body: <p>I am having trouble with a bootstrap accordion. I would like the accordion to open a specific section and then close all other sections so to leave the focus only ever on one accordion box. I have a nested accordion also which I am thinking is causing some problems.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="panel panel-group" id="accordion"&gt;
              &lt;div class="panel panel-default"&gt;
                  &lt;div class="brown panel-heading"&gt;
                      &lt;h4 class="panel-title"&gt;
                          &lt;a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#col_1"&gt;
                             Accordion #1
                          &lt;/a&gt;
                      &lt;/h4&gt;
                  &lt;/div&gt;
                  &lt;div id="col_1" class="panel-collapse collapse in"&gt;
                      &lt;div class="panel-body"&gt;
                          &lt;div class="panel panel-default"&gt;
                              &lt;div class="pink panel-heading"&gt;
                                  &lt;h4 class="panel-title" style="font-size: 14px;"&gt;
                                      &lt;a class="accordion-toggle2" data-toggle="collapse" data-parent="#col_2" href="#col_2"&gt;
                                         Accordion #sub1 
                                      &lt;/a&gt;
                                  &lt;/h4&gt;
                              &lt;/div&gt;
                              &lt;div id="col_2" class="panel-collapse collapse"&gt;
                                  &lt;div class="panel-body"&gt;
                                      &lt;p&gt;Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum &lt;/p&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="panel panel-default"&gt;
                              &lt;div class="pink panel-heading"&gt;
                                  &lt;h4 class="panel-title" style="font-size: 14px;"&gt;
                                      &lt;a class="accordion-toggle2" data-toggle="collapse" data-parent="#col_3" href="#col_3"&gt;
                                          Accordion #sub2
                                      &lt;/a&gt;
                                  &lt;/h4&gt;
                              &lt;/div&gt;
                              &lt;div id="col_3" class="panel-collapse collapse"&gt;
                                  &lt;div class="panel-body"&gt;
                                      &lt;p&gt;Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum &lt;/p&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="panel panel-default"&gt;
                              &lt;div class="pink panel-heading"&gt;
                                  &lt;h4 class="panel-title" style="font-size: 14px;"&gt;
                                      &lt;a class="accordion-toggle2" data-toggle="collapse" data-parent="#col_4" href="#col_4"&gt;
                                        Accordion #sub3
                                      &lt;/a&gt;
                                  &lt;/h4&gt;
                              &lt;/div&gt;
                              &lt;div id="col_4" class="panel-collapse collapse"&gt;
                                  &lt;div class="panel-body"&gt;
                                      &lt;p&gt;Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum &lt;/p&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="panel panel-default"&gt;
                      &lt;div class="brown panel-heading"&gt;
                          &lt;h4 class="panel-title"&gt;
                              &lt;a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#col_7"&gt;
                                 Accordion #2 
                              &lt;/a&gt;
                          &lt;/h4&gt;
                      &lt;/div&gt;
                      &lt;div id="col_7" class="panel-collapse collapse"&gt;
                          &lt;div class="panel-body"&gt;
                              &lt;p&gt;Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum &lt;/p&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="panel panel-default"&gt;
                      &lt;div class="brown panel-heading"&gt;
                          &lt;h4 class="panel-title"&gt;
                              &lt;a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#col_8"&gt;
                                 Accordion #3
                              &lt;/a&gt;
                          &lt;/h4&gt;
                      &lt;/div&gt;    
                      &lt;div id="col_8" class="panel-collapse collapse"&gt;
                           &lt;div class="panel-body"&gt;
                              &lt;p&gt;Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum &lt;/p&gt;
                           &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  </code></pre>