Code Snippet for Accordion built on top of Bootstrap. Javascript functionality added via adding data-* attributes to HTML which is a part of Bootstrap Javascript Plugin.

accordionSample.html

<div class='panel-group'>
  
  <div class='panel panel-success'>
    <div class='panel-heading'>
      <h4 class='panel-title'>
        <a data-toggle='collapse' data-parent='.panel-group' href='#systemsOperational'>All Systems Operational</a>
      </h4>
    </div>
    <div id='systemsOperational' class='panel-collapse collapse in'>
      <div class='panel-body'>
        <p>All systems are operational</p>
        <ul class='list-unstyled'>
          <li><i class='glyphicon glyphicon-ok'></i>  Transporters</li>
          <li><i class='glyphicon glyphicon-ok'></i>  Space Elevator</li>
          <li><i class='glyphicon glyphicon-ok'></i>  RocketBus</li>
        </ul>
      </div>
    </div>
  </div>

  <div class='panel panel-warning'>
    <div class='panel-heading'>
      <h4 class='panel-title'>
        <a data-toggle='collapse' data-parent='.panel-group' href='#weatherAlert'>Weather Alert</a>
      </h4>
    </div>
    <div id='weatherAlert' class='panel-collapse collapse'>
      <div class='panel-body'>
        <p>The National Weather Service has issued a solar flare watch for the following time periods. Please plan accordingly:</p>
        <ul class='list-unstyled'>
          <li><strong>February 9th, 21:43</strong></li>
          <li><strong>May 18, 19:82</strong></li>
          <li><strong>July 4, 08:42</strong></li>
        </ul>
      </div>
    </div>
  </div>

  <div class='panel panel-danger'>
    <div class='panel-heading'>
      <h4 class='panel-title'>
        <a data-toggle='collapse' data-parent='.panel-group' href='#transportationWarning'>Transportation Generals Warning: Transporters</a>
      </h4>
    </div>
    <div id='transportationWarning' class='panel-collapse collapse'>
      <div class='panel-body'>
        <p>Technically, transporting means making a clone of yourself and killing off the other one. If you believe in a soul, you should be aware of this fact before attempting travel using a transporter.</p>
      </div>
    </div>
  </div>

</div>