title: Open Bootstrap accordion panel from menu bar
body: <p>my menu put in header.html which will be loaded in all pages. </p>
  
  <p>If I click the menu from index.html, it will open the corresponding accordion panel in product.html by using below js code (which place in the end of product.html markup ).</p>
  
  <p>But if I click the menu from product.html, no respond from the accordion panel.
  what wrong with my code?</p>
  
  <pre><code>$(function(){
  
  // check if there is a hash in the url
  if ( window.location.hash != '' )
  {
      // remove any accordion panels that are showing (they have a class of 'in')
      $('.collapse').removeClass('in');
  
      // show the panel based on the hash now:
      $(window.location.hash + '.collapse').collapse('show');
  }
  </code></pre>
  
  <p>});</p>
  
  <p>header.html</p>
  
  <pre><code>&lt;header&gt;
  &lt;nav class="navbar navbar-default menu" role="navigation"&gt;
      &lt;div class="container-fluid"&gt;
  &lt;div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
              &lt;ul class="nav navbar-nav navbar-left"&gt;
                  &lt;li class="dropdown"&gt;
                      &lt;a href="#" class="dropdown-toggle menu-item" data-toggle="dropdown"&gt;Products
                          &lt;b class="caret"&gt;&lt;/b&gt;
                      &lt;/a&gt;
                      &lt;div class="row"&gt;
                          &lt;div class="col-md-6"&gt;
                              &lt;div&gt;
                                  &lt;ul&gt;
                                      &lt;li&gt;
                                          &lt;a href="product.html#collapse1"&gt;product A&lt;/a&gt;
                                      &lt;/li&gt;
                                      &lt;li class="menu-li" wp-loop-skip&gt;
                                          &lt;a href="product.html#collapse2"&gt; product B&lt;/a&gt;
                                      &lt;/li&gt;
                                      &lt;li class="menu-li" wp-loop-skip&gt;
                                          &lt;a href="product.html#collapse3"&gt; product C&lt;/a&gt;
                                      &lt;/li&gt;
  
                                  &lt;/ul&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
  
                      &lt;/div&gt;
                  &lt;/li&gt;
  
              &lt;/ul&gt;
  
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p></p>
  
  <p>Thanks.</p>