title: Scroll to next section
body: <p>My code looks like this:</p>
  
  <pre><code>&lt;div id="arrow"&gt;
      &lt;a class="next"&gt;&lt;/a&gt;
      &lt;a class="previous"&gt;&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;section id="first"&gt;
  ...
  &lt;/section&gt;
  
  &lt;section id="second"&gt;
  ...
  &lt;/section&gt;
  
  &lt;section id="third"&gt;
  ...
  &lt;/section&gt;
  </code></pre>
  
  <p>The element <code>#arrow</code> has <code>position: fixed</code>, and I'm trying to make the window scroll to the next <code>section</code> when <code>a.next</code> is clicked.</p>
  
  <p>Ex: The first time <code>a.next</code> is clicked, the window scrolls to <code>section#first</code>, the second time, the window scrolls to <code>section#second</code>, etc. The same thing happens to <code>a.previous</code>.</p>
  
  <p>Does someone know how to solve this problem?</p>
  
  <p>Thanks a lot!</p>
  
  <hr>
  
  <p><strong>EDIT</strong></p>
  
  <p>My JS code:</p>
  
  <pre><code>$('#arrows a.previous').click(function() {
      $.scrollTo($(this).closest('section').prev(),800);
  });
  
  $('#arrows a.next').click(function() {
      $.scrollTo($(this).closest('section').next(),800);
  });     
  </code></pre>