title: Bootstrap accordion won't collapse other elements when one is opened
body: <p>I try to make an accordion with normal accordion behaviour: there should only be one open element. I found a similar problem here: <a href="https://stackoverflow.com/questions/15444758/collapse-plugin-only-show-one-panel-at-a-time">Collapse plugin: Only show one panel at a time</a>, but the solution doesn't fit for me, as I match <code>data-parent="#pricing-list-0</code> with <code>id="#pricing-list-0"</code> in the parent element.</p>
  
  <p>Here is the code</p>
  
  <pre><code>    &lt;div class="panel-group" id="pricing-list-0"&gt;
      &lt;ul class="list-group"&gt;
  
          &lt;li class="list-group-item"&gt;
              &lt;div class="panel panel-default"&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;h4 class="panel-title"&gt;
                          &lt;a data-toggle="collapse" data-parent="#pricing-list-0" href="#collapse0-0" class="" aria-expanded="true"&gt;
                              Artful &amp;amp; responsive website, ...
                          &lt;/a&gt;
                      &lt;/h4&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div id="collapse0-0" class="panel-collapse collapse in" aria-expanded="true"&gt;
                &lt;div class="panel-body"&gt;You give us the freedom ...&lt;/div&gt;
              &lt;/div&gt;                            
          &lt;/li&gt;
  [...]
  </code></pre>
  
  <p>Codepen is here: <a href="https://codepen.io/lafisrap/pen/YVVbev" rel="nofollow noreferrer">https://codepen.io/lafisrap/pen/YVVbev</a></p>
  
  <p>Why is it not closing, though <code>data-parent="#pricing-list-0"</code> and <code>id="pricing-list-0"</code> are matching?</p>