title: Jquery "TypeError: offset is null "
body: <p>I have jquery script for scrolling through content from element to element with same class...
  Everything works fine when I press button next first time, it gets scrolled to the first element but when I press it second time to scroll to next element I get a console error:</p>
  
  <p><em>TypeError: offset is null</em></p>
  
  <p>Script:</p>
  
  <pre><code>    /**  scroll to element function **/
  
  function scrollToElement(selector, time, verticalOffset) {
      time = typeof (time) != 'undefined' ? time : 500;
      verticalOffset = typeof (verticalOffset) != 'undefined' ? verticalOffset : 0;
      element = $(selector);
      offset = element.offset();
      offsetTop = offset.top + verticalOffset;
      $('html, body').animate({
          scrollTop: offsetTop
      }, time);
  }
  
  /**document ready**/
  $(document).ready(function () {
      count = 0;
      var max_length = $('.highlight1').length;
      /* scroll to 150px before .highlight with animation time of 400ms */
      $('#next1').click(function (e) {
          if (count &lt; max_length) {
              count++;
          } else {
              count = 1;
          }
          e.preventDefault();
          scrollToElement('.highlight1:nth-child(' + count + ')', 400, -150);
      });
  
      $('#prev1').click(function (e) {
          if (count &gt; 1) {
              count--;
          } else {
              count = max_length;
          }
          e.preventDefault();
          scrollToElement('.highlight1:nth-child(' + count + ')', 400, -150);
      })
  });
  </code></pre>
  
  <p>html is a bit messy because there is everything in one file which look like this <a href="http://pastebin.com/t0PpU7Vm" rel="nofollow">http://pastebin.com/t0PpU7Vm</a></p>