Bootstrap 3.0 -Keep Accordions Open

by Korah Babu Varghese

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css">
<html><head>

  
</head>

<body>
  <button id="collapse-init" class="btn btn-primary">
    Disable accordion behavior
</button>
<br><br>

<div class="panel-group dc" id="accordion">
    <!-- First Panel -->
    <div class="panel panel-default">
        <div class="panel-heading hi">
             <h4 class="panel-title" data-toggle="collapse" data-target="#collapseOnet">
                 Collapsible Group Item #1
             </h4>
        </div>
        <div id="collapseOnet" class="panel-collapse in" style="height: auto;">
            <div class="panel-body">
                <div class="panel panel-default">
        <div class="panel-heading sec">
             <h4 class="panel-title" data-toggle="collapse" data-target="#collapseOnew">
                 Collapsible Group Item #1
             </h4>
        </div>
        <div id="collapseOnew" class="panel-collapse in" style="height: auto;">
            <div class="panel-body">
                <div class="panel panel-default">
        <div class="panel-heading sec">
             <h4 class="panel-title" data-toggle="collapse" data-target="#collapseOner">
                 Collapsible Group Item #1
             </h4>
        </div>
        <div id="collapseOner" class="panel-collapse collapse">
            <div class="panel-body">
                Anim pariatur cliche reprehenderit, 
                enim eiusmod high life accusamus terry richardson ad squid.
            </div>
        </div>
    </div>
     <div class="panel panel-default">
        <div class="panel-heading sec">
             <h4 class="panel-title" data-toggle="collapse" data-target="#collapseOne">
                 Collapsible Group Item #1
             </h4>
        </div>
...

CSS

.dc .panel-default .panel-heading{
  background-color:#333 !important;
    background:#333 !important;
    color:#fff;
}

.dc  .panel-body .panel-default .panel-body .panel-default .panel-heading{
  background-color:green !important;
    background:green !important;
    color:#333;
}
.dc .panel-body .panel-default .panel-heading{
  background-color:red !important;
    background:red !important;
    color:#333;
}