title: Bootstrap 3 collapse scrollTop
body: <p>I'm having a little trouble with Bootstrap 3's accordion. </p>
  
  <p>What I want to do is add a class to the accordion-toggle and then scroll/jump to that newly added class. Adding/removing the class works fine and I figured I would just add a scrollTop with in that same block...but no such luck. What am I missing?</p>
  
  <p>Here is how it's set up:</p>
  
  <p>links to panels:</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li&gt;&lt;a data-toggle="collapse" data-parent="#accordion" href="#panel1"&gt;Panel1&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;&lt;a data-toggle="collapse" data-parent="#accordion" href="#panel2"&gt;Panel2&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
          &lt;a data-toggle="collapse" data-parent="#accordion" href="#panel3" "&gt;Panel3&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Panels:</p>
  
  <pre><code>&lt;div class="panel-group" id="accordion"&gt;
      &lt;div class="panel panel-default"&gt;
          &lt;div class="panel-heading"&gt;
               &lt;h4 class="panel-title"&gt;
      &lt;a class="accordion-toggle aWeight active" data-toggle="collapse" data-parent="#accordion" href="#panel1"&gt;
      Panel 1
      &lt;/a&gt;
      &lt;/h4&gt;
  
          &lt;/div&gt;
          &lt;div id="panel1" class="panel-collapse collapse in"&gt;
              &lt;div class="panel-body"&gt;Anim pariatur...&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="panel panel-default"&gt;
          &lt;div class="panel-heading"&gt;
               &lt;h4 class="panel-title"&gt;
      &lt;a class="accordion-toggle aFitness" data-toggle="collapse" data-parent="#accordion" href="#panel2"&gt;
      Panel 2
      &lt;/a&gt;
      &lt;/h4&gt;
  
          &lt;/div&gt;
          &lt;div id="panel2" class="panel-collapse collapse"&gt;
              &lt;div class="panel-body"&gt;Anim pariatur...&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="panel panel-default"&gt;
          &lt;div class="panel-heading"&gt;
               &lt;h4 class="panel-title"&gt;
      &lt;a class="accordion-toggle aFitness" data-toggle="collapse" data-parent="#accordion" href="#panel3"&gt;
      Panel 3
      &lt;/a&gt;
      &lt;/h4&gt;
  
          &lt;/div&gt;
          &lt;div id="panel3" class="panel-collapse collapse"&gt;
              &lt;div class="panel-body"&gt;Anim pariatur...&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and lastly I'm using this script to toggle the active class:</p>
  
  <pre><code>$(function () {
      $('.accordion').on('show', function (e) {
          $(e.target).prev('.accordion-heading').find('.accordion-toggle').addClass('active');
      });
      $('.accordion').on('hide', function (e) {
          $(this).find('.accordion-toggle').not($(e.target)).removeClass('active');
      });
  });
  </code></pre>