<script src="jquery.js" type="text/javascript"></script>
<script src="DataLazyLoad.min.js" type="text/javascript"></script>

<ul class = 'list'>
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
<li>dddd</li>
<li>eeee</li>
<li>ffff</li>
<li>gggg</li>
</ul>

//Call DataLazyLoad
$(function(){
  $(".list").DataLazyLoad({load : function(page, unLocked)
  {
      var html = '';
      var max = 10;
      //Generate the data
      for (var i = 0; i < 10; i++)
      {
           html += '<li>Page: ' + page + ', Data Index: ' + i + ' </li>';
      }
      $(html).appendTo('.list');
      //Check whether to end
      page = page >= max ? 0 : page + 1;
      //You must call after loading the data, To prevent repeated load, The first parameter to the next page, No page is 0
      unLocked(page);
      if (page == 0)
      {
          $("<li class = 'h2'>The End!</li>").appendTo('.list');
      }
  }});
});

$(".list").DataLazyLoad(options);