title: Bootstrap accordion in Wordpress
body: <p>I'm trying to get Bootstrap's accordion to work in Wordpress, but I'm not sure what else I have to add in the loop. At the moment, its expanding the first panel only no matter which one I click, and not displaying any content. </p>
  
  <pre><code>       &lt;div class="panel-group" id="accordian" role="tablist" aria-multiselectable="true"&gt;
  
              &lt;?php 
                  $args = array(
                      'post_type'         =&gt; 'faq_question',
                      'category_name'     =&gt; 'order',
                      'posts_per_page'    =&gt; -1
                  );  
                  $loop = new WP_Query( $args );
                  while ( $loop-&gt;have_posts() ) : $loop-&gt;the_post();
              ?&gt;
  
              &lt;div class="panel panel-default"&gt;
                  &lt;div class="panel-heading" role="tab" id="&lt;?php the_ID(); ?&gt;"&gt;
                      &lt;h4 class="panel-title"&gt;
                          &lt;a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordian" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"&gt;&lt;?php the_title();?&gt;&lt;/a&gt;
                      &lt;/h4&gt;
                  &lt;/div&gt;&lt;!-- end panel heading --&gt;
                  &lt;div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="&lt;?php the_ID(); ?&gt;"&gt;
                      &lt;div class="panel-body"&gt;
                          &lt;p&gt;&lt;?php the_content(); ?&gt;&lt;/p&gt;
                      &lt;/div&gt;&lt;!-- end panel body --&gt;
                  &lt;/div&gt;&lt;!-- end panel collapse --&gt;
              &lt;/div&gt;&lt;!-- end panel default --&gt;
              &lt;?php endwhile; wp_reset_query(); ?&gt;
          &lt;/div&gt;&lt;!-- end panel group --&gt;
  </code></pre>
  
  <p>Appreciate any help, thanks.</p>