title: how to use multiple bootstrap collapse elements dynamically in php
body: <p>I am using this code which contains html along with php, when there are multiple elements in collapse only the first element is working properly because there is id named collapseOne which should change dynamically for each element.</p>
  
  <p>So, the problem is how to change the id dynamically  </p>
  
  <pre><code> &lt;div class="accordion"&gt;
      &lt;?php foreach ($topics_list-&gt;result_array() as $row) { ?&gt;    
          &lt;div class="accordion-group"&gt;
              &lt;div class="accordion-heading"&gt;
                  &lt;a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne"&gt;
                      &lt;h2&gt;&lt;?php echo $row['name'];
          ?&gt;&lt;/h2&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
              &lt;div id="collapseOne" class="accordion-body collapse "&gt;
                  &lt;div class="accordion-inner"&gt;
                      &lt;b&gt;&lt;h3&gt; Material Link-:&lt;?php
                              echo "&lt;a href='" . $row['link'] . "'&gt;Link&lt;/a&gt;&lt;/h3&gt;&lt;/b&gt;";
                              echo"&lt;br&gt; &lt;b&gt;&lt;h3&gt;Hardness-:";
                              echo $row['hardness'] . "&lt;/h3&gt;&lt;/b&gt;";
                              echo "&lt;br&gt;&lt;b&gt;&lt;h3&gt;Type-:" . $row['type'] . "&lt;/h3&gt;&lt;/b&gt;";
                              ?&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
         &lt;/div&gt;            
                          &lt;?php } ?&gt;
  &lt;/div&gt;
                          &lt;/div&gt;            
                      &lt;?php } ?&gt;
                      &lt;/div&gt;
  </code></pre>