如何创建无限循环的无序列表

Question

我正在尝试在jQuery中创建一个无限滚动的无序列表，因此，如果用户到达div的底部，它将再次从第一个项目开始，依此类推，而不会出现任何跳跃或停顿。

我尝试仅在用户每次到达div（这是一个无序列表，现在有14个列表项）的底部时附加#scroller div内容，但是在滚动很多之后它开始滞后。因此，以某种方式，我认为我也应该删除列表中的前几对，这就是我遇到的问题。

var scrollLength = $("#scroller li").length;
var scrollContent = $('#scroller').html();

$("#scroller").scroll(function () {
    if ($(this).scrollTop() >= ($(this)[0].scrollHeight - $(this).outerHeight() - 50)) {
        $("#scroller").append(scrollContent);
        if (scrollLength * 3 == $("#scroller li").length) {
            $("#scroller li").slice(0, scrollLength).remove();
        }
    }
});

我以这种方式认为，如果#scroller div的内容重复两次，则第一批列表项将被删除，但是在添加第二批列表项后它只是停止滚动。