Bootstrap: Accordion not auto collapsing previously opened panel

I need to create a bootstrap accordion. The markup below works fine, but it does not auto-collapse the previously opened element. For example, open panel1, then click on panel2.. panel1 should then auto-close, but it does not. I have tried copying the markup exactly from the bootstrap site (http://twitter.github.com/bootstrap/javascript.html#collapse), but it is not working. What am I missing? ``` <h3>ACCORDION DEMO</h3> <div class="accordion" id="accordion1"> <div class="accordion-group"> <div class="accordion-heading"> <a class="accordion-toggle" data-parent="accordion1" data-toggle="collapse" href="#panel1">Panel 1</a> </div> <div class="accordion-body collapse" id="panel1"> <div class="accordion-inner"> <p>This is accordion panel 1 content</p> </div> </div> </div> <div class="accordion-group"> <div class="accordion-heading"> <a class="accordion-toggle" data-parent="accordion1" data-toggle="collapse" href="#panel2">Panel 2</a> </div> <div class="accordion-body collapse" id="panel2"> <div class="accordion-inner"> <p>This is accordion panel 2 content</p> </div> </div> </div> </div> ```