JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<div class="panel-group" id="accordion">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
          Group 1
        </a>
      </h4> 
    </div>
    <div id="collapseOne" class="panel-collapse collapse in" id="one">
      <div class="panel-body">
        <a class="accordion-toggle" data-toggle="collapse" data-parent="#one" href="#collapseOneone">
          Subgroup Item #1.1
        </a>
        <div id="collapseOneone" class="panel-collapse collapse in">
          <div class="panel-body">
            some item.
          </div>
        </div>
       </div>         
        <div class="panel-body">
          <a class="accordion-toggle" data-toggle="collapse" data-parent="#one" href="#collapseOnetwo">
            Subgroup Item #1.2
          </a>
          <div id="collapseOnetwo" class="panel-collapse collapse in">
            <div class="panel-body">
              some item.
            </div>
          </div>
        </div> 
              
              
      </div>
    </div>
  </div>




<div class="panel-group" id="accordion1">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1" href="#collapseTwo">
          Group 2
        </a>
      </h4> 
    </div>
    <div id="collapseTwo" class="panel-collapse collapse in" id="two">
      <div class="panel-body">
        <a class="accordion-toggle" data-toggle="collapse" data-parent="#two" href="#collapseTwoone">
          Subgroup Item #2.1
        </a>
        <div id="collapseTwoone" class="panel-collapse collapse in">
          <div class="panel-body">
            some item.
        ...

CSS

.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: grey;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}