我想为jQuery的每个命令添加一个滚动和无限滚动

Question

The following code parses an rss feed from XML and displays it as a listview on a php/jquery page. Pretty cool so far with only only issue

 function parseXml(xml)
  {
    $("#main").html("<ul id='content' data-role='listview' data-inset='true'></ul>");

    //make window scrollable after items exceed document height
    $document_height = $(document).height();
    $culminated_height = 0;
    $items_displayed_on_screen = 0;

    $(xml).find("item").each(function()
    {

      $("#content").append("<li><a href='"+$(this).find("date").text()+"'><img src='"+$(this).find("location").text()+"'/><h2>"+$(this).find("report").text()+"</p></a></li>");

      //make scrollable after document height is reached
      $culminated_height  +=  $("li").height();

      $items_displayed_on_screen++;
      if ($culminated_height >= $document_height){



              return false; //break
          }

    });

I cant make this scrollable. So far the $culminated_height and $document_height help me to stop displaying more items when the culminated height exceeds the window/document height. I need this section to be scrollable that does not greatly exceed the window height and further content sort of auto loads as a user goes further down the scroll. I've looked into jquery infinite scrolling techniques but can't seem to make them work with this jQuery each function so far. Any help?