jQuery Mobile - Infinite scroll (Updated)

<!DOCTYPE html>
<html>

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>
<div data-role="page" id="home">
    <div data-role="header" data-position="fixed" data-tap-toggle="false"> <a href="#" class="ui-btn ui-btn-left">0</a>

         <h1>Header</h1>

<a href="#" class="ui-btn ui-btn-right">0</a>

    </div>
    <div role="main" class="ui-content">
        <ul data-role="listview" id="list"></ul>
    </div>
    <div data-role="footer" data-position="fixed" data-tap-toggle="false">
         <h1>Footer</h1>

    </div>
</div>

</body>

</html>

/* for demo only */
$(document).on("pagebeforecreate", "#home", function(e, ui) {
  var items = '';
  for (var i = 1; i < 100; i++) {
    items += "<li>" + i + "</li>";
  }
  $("#list").append(items);
});

/* check scroll function */
function checkScroll() {
  var activePage = $.mobile.pageContainer.pagecontainer("getActivePage"),
    screenHeight = $.mobile.getScreenHeight(),
    contentHeight = $(".ui-content", activePage).outerHeight(),
    header = $(".ui-header", activePage).outerHeight() - 1,
    scrolled = $(window).scrollTop(),
    footer = $(".ui-footer", activePage).outerHeight() - 1,
    scrollEnd = contentHeight - screenHeight + header + footer;
  $(".ui-btn-left", activePage).text("Scrolled: " + scrolled);
  $(".ui-btn-right", activePage).text("ScrollEnd: " + scrollEnd);
  if (activePage[0].id == "home" && scrolled >= scrollEnd) {
    console.log("adding...");
    addMore(activePage);
  }
}

/* add more function */
function addMore(page) {
  $(document).off("scrollstop");
  $.mobile.loading("show", {
    text: "loading more..",
    textVisible: true
  });
  setTimeout(function() {
    var items = '',
      last = $("li", page).length,
      cont = last + 5;
    for (var i = last; i < cont; i++) {
      items += "<li>" + i + "</li>";
    }
    $("#list", page).append(items).listview("refresh");
    $.mobile.loading("hide");
    $(document).on("scrollstop", checkScroll);
  }, 500);
}

/* attach if scrollstop for first time */
$(document).on("scrollstop", checkScroll);

/* Styles go here */

#jQuery Mobile 1.4

##Infinite scroll (Updated)

###Fixed multiple "scrollstop" firing

http://jqmtricks.wordpress.com/2014/07/15/infinite-scrolling/