infinite scroll jquery [scroll() -> get() -> insertAfter()]

infinite_scroll.js

 
 $(window).scroll($.debounce(50), function() {

      if ($(window).scrollTop() === $(document).height() - $(window).height()) {
        
       var nextId = $('.article:last').data('next'); // gets the id of 'next' article from markup.
        
       $.get('/ajax-article/' + nextId, function(content) { // gets the html

          $($('.article', content)).insertAfter('.article:last'); //insert html after last article

        });
      }
  });

////////////////////
/// another method
////////////////////

var articleIds = [123123,123133,1231234,1211235]; 
var index = 0;

var infiniteScroll = function (){
  if ( $(window).scrollTop() >= $(document).height() - $(window).height() - 300 ){
    $(window).unbind('scroll',infiniteScroll); // turn off scroll event
    if (index < articleIds.length) {
      $.get('/ajax-article' + articleIds[index], function(content) {

        $(content).insertAfter($('.article:last'));
        $(window).bind('scroll',infiniteScroll); // turn it back on
        index++;
      });
    }
  }
};

$(window).bind('scroll', infiniteScroll);