title: Scroll clicked element to top of the window
body: <p>I need some help from jQuery geeks. 
  this is my HTML code</p>
  
  <pre><code>&lt;div class="activity-accordian activdesti-list"&gt;    
  &lt;div class="activity-box-wrap"&gt;
          &lt;div id="headerone-hd"&gt;&lt;/div&gt;
          &lt;h3 data-subject="Header One" id="headerone" class="headerone-hd active-header"&gt;Header One&lt;/h3&gt;
              &lt;div id="headerone-wrap" class="categ-content"&gt;
                  ...
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="activity-box-wrap"&gt;
          &lt;div id="headertwo-hd"&gt;&lt;/div&gt;
          &lt;h3 data-subject="Header Two" id="headertwo" class="headertwo-hd active-header"&gt;Header Two&lt;/h3&gt;
              &lt;div id="headertwo-wrap" class="categ-content"&gt;
                  ...
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="activity-box-wrap"&gt;
          &lt;div id="headerthree-hd"&gt;&lt;/div&gt;
          &lt;h3 data-subject="Header Three" id="headerthree" class="headerthree-hd active-header"&gt;Header Three&lt;/h3&gt;
              &lt;div id="headerthree-wrap" class="categ-content"&gt;
                  ...
              &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is js code which tried but didn't work</p>
  
  <pre><code>function _scrollTopHead() {
      $('.activity-accordian h3').on('click', function(e){
          var idName = $(this).attr('id');
          $('html, body').animate({scrollTop:$("#"+idName+"-hd").offset().top}, 'slow');
      });
  }
  </code></pre>
  
  <p>I need h3 tag header to scroll top when that tag is clicked.
  (i.e if some one click h3 tag where id="headertwo" that h3 tag should scroll up and position in top of the browser. any help would appriciate</p>
  
  <p>Thanks </p>