Accordion

Minimal nested accordion tags

by Osama Qassar

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.1/js/bootstrap.min.js"></script>
<!-- accodion 1-->
<div id="accordion" >
  <div>
    <a class="" data-toggle="collapse" data-target="#collapseOne">
      Collapsible Group Item #1
    </a>
    <div id="collapseOne" class="collapse" data-parent="#accordion">
    
      <!-- accodion 2 -->
      <div id="accordion_2" class="accordion">
        <div>
          <a class="" data-toggle="collapse" data-target="#collapse_2_1">
            Collapsible Group Item #2
          </a>
          <div id="collapse_2_1" class="collapse " data-parent="#accordion_2">
            11111111111Anim pariatur cliche e sustainable VHS.
          </div>
        </div>
        <div>
          <a class="" data-toggle="collapse" data-target="#collapse_2_2">
            Collapsible Group Item #2
          </a>
          <div id="collapse_2_2" class="collapse " data-parent="#accordion_2">
            
            
            <!-- accodion 3 -->
            <div id="accordion_3" class="accordion">
              <div>
                <a class="" data-toggle="collapse" data-target="#collapse_3_1">
                  Collapsible Group Item #2
                </a>
                <div id="collapse_3_1" class="collapse " data-parent="#accordion_3">
                  11111111111Anim pariatur cliche e sustainable VHS.
                </div>
              </div>
              <div>
                <a class="" data-toggle="collapse" data-target="#collapse_3_2">
                  Collapsible Group Item #2
                </a>
                <div id="collapse_3_2" class="collapse " data-parent="#accordion_3">
                  11111111111Anim pariatur cliche e sustainable VHS.
                </div>
              </div>
        ...

CSS

.accordion{padding:4px 20px}