Dyamic Collapsable

HTML

<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="panel-group">
  <div class="panel panel-default">
    <div class="panel-heading accordian-button">
      <h4 class="panel-title">
          <a href="#section-one">Section One</a>
      </h4>
    </div>
    <div class="accordian-body panel-collapse collapse in">
      <div class="panel-body">
        Section One Text
      </div>
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-heading accordian-button">
      <h4 class="panel-title">
        <a href="#section-two">Section Two</a>
      </h4>
    </div>
    <div class="accordian-body panel-collapse collapse in">
      <div class="panel-body">
        Section Two Text
      </div>
    </div>
  </div>
</div>
<div>
<p>Nam porta ligula dui, non hendrerit purus lacinia eu. Integer condimentum egestas ultricies. Nulla lectus mi, volutpat at faucibus sed, accumsan ut dui. Sed rutrum elit arcu. In augue lectus, aliquet sed sagittis non, consectetur sit amet augue. Duis placerat diam purus, vitae maximus diam auctor viverra. Aliquam aliquam, justo eu varius dapibus, diam orci gravida ligula, in semper velit velit at turpis. Quisque scelerisque enim sem, eget iaculis orci sagittis sed. Nullam lacinia pretium facilisis.
</p>
<p>Suspendisse nec mauris at sapien ornare posuere. Ut lacinia molestie erat, vel pulvinar dui euismod ut. Fusce cursus ex ac velit mattis blandit. Sed sem erat, sagittis ac erat ac, rhoncus condimentum metus. Mauris a dolor placerat, mollis orci nec, bibendum urna. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut scelerisque sagittis eleifend. Vestibulum odio ligula, convallis ac turpis quis, blandit accumsan elit. Etiam congue sem arcu. Donec sodales elit nec odio placerat pulvinar. Cras at aliquam nulla.
</p>
<p>Nullam quis...

JavaScript

$(".accordian-button").click(function(e) {
  that = $(this)
  accordian = that.siblings('.accordian-body')
  $(".accordian-body").not(accordian).collapse('hide')
  accordian.collapse('toggle')
})

// Kludge for allowing all accordians to be collapsed to start
$(".accordian-body").collapse('hide')