JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap.js"></script>
<div id="accordion" class="accordion">
    <div class="accordion-group">
        <a href="#body1" data-parent="#accordion" data-toggle="collapse">
            First Item <span class="caret"/>
        </a>
        <div id="body1" class="accordion-body in">First Content</div>
    </div>
    <div class="accordion-group">
        <a href="#body2" data-parent="#accordion" data-toggle="collapse" class="collapsed">
            Second Item <span class="caret"/>
        </a>
        <div id="body2" class="accordion-body collapse">Second Content</div>
    </div>
    <div class="accordion-group">
        <a href="#body3" data-parent="#accordion" data-toggle="collapse" class="collapsed">
            Third Item <span class="caret"/>
        </a>
        <div id="body3" class="accordion-body collapse">Third Content</div>
    </div>
</div>

CSS

.collapsed .caret {
  border-top: 0;
  border-bottom: 4px solid #000000;
}

.accordion .caret {
  margin-top: 8px;
  margin-left: 2px;
}