title: Bootstrap 4 | Collapse other sections when one is expanded
body: <p>I am working on bootstrap 4 Collapse. Wanted to collapse other sections when one is expanded</p>
  
  <p>So far i did is  : </p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;p&gt;
    &lt;a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample"&gt;
      content 1
    &lt;/a&gt;
    &lt;button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample2" aria-expanded="false" aria-controls="collapseExample2"&gt;
      Content 2
    &lt;/button&gt;
  &lt;/p&gt;
  
  &lt;div class="collapse" id="collapseExample"&gt;
    &lt;div class="card card-body"&gt;
      Content one here
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="collapse" id="collapseExample2"&gt;
    &lt;div class="card card-body"&gt;
      Content 2 here
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Live demo: <a href="https://codepen.io/sifulislam/pen/NYBEMJ" rel="noreferrer">Live Demo</a></p>