Перезагрузка нового контента при прокрутке

Question

Я использую следующий jQuery, который устанавливает id последнего элемента в UL равным 'last_item'.

function oldest() {
 j('ul li:last-child').addClass( 'last_item' );
 oldestName = j('.last_item').attr('id');
 alert('last ID is:'+ oldestName +'.');
}

j(window).scroll(function(){
    if  (j(window).scrollTop() == j(document).height() - j(window).height()){
            j.ajax({
                url: "older.php?oldest="+oldestName+"",
                cache: false,
                success: function(html){
                    j(".older").html(html);
                    oldest();
                }
            })
    }
}); 

oldest(); //Call function on page load

$('.button2').click(function() {
    j('.older ul > *').clone().hide().appendTo('.tweets ul').slideDown();
    oldest();
});

Во время прокрутки вызывается файл old.php, содержащий:

$oldest = $_GET['oldest'];

$getolder = mysql_query(" SELECT * FROM table where date < $oldest ORDER BY date DESC LIMIT 20");

Однако в настоящее время происходит то, что записи из базы данных возвращаются назад, сохраняются в скрытом DIV.Затем я использую jQuery для добавления этих записей в конец списка.

Однако в следующий раз, когда я прокручиваю до конца страницы и нажимаю кнопку, те же записи добавляются в списки.

Может ли кто-нибудь помочь мне выяснить, почему это так?

По сути, кажется, что $ old не обновляется с новой датой последнего элемента UL.

Answer 1

Вам нужно удалить исходный класс "last_item" из элемента списка, прежде чем добавить его в новый последний элемент ...

 j('ul li').removeClass( 'last_item' );