title: jQuery: detecting reaching bottom of scroll doesn't work, only detects the top
body: <p>So basically my problem is a seemingly simple one.</p>
  
  <p>You can see it in action at <a href="http://furnace.howcode.com" rel="nofollow noreferrer">http://furnace.howcode.com</a> (please note that data is returned via Ajax, so if nothing happens give it a few moments!).</p>
  
  <p>What's MEANT to happen, is in the second column when you reach the bottom of scrolling, the next 5 results are returned.</p>
  
  <p>But what actually happens is it only returns the 5 results when you hit the TOP of the scroll area. Try it: scroll down, nothing happens. Scroll back up to the top, the results are returned.</p>
  
  <p>What's going wrong?</p>
  
  <p>Here's my code I'm using:</p>
  
  <pre><code>$('#col2').scroll(function(){
      if ($('#col2').scrollTop() == $('#col2').height() - $('#col2').height()){
         loadMore();
      }
  });
  </code></pre>
  
  <p><code>loadMore();</code> is the function that gets the data and appends it.</p>
  
  <p>So what's going wrong here? Thanks for your help!</p>