jQuery的自定義函數不是定位在AJAX加載的內容

Question

的div我寫了一個定位容器內絕對的div計算頂部位置和高度的自定義函數：

$.fn.gridB = function() { 
    var o = $(this); //EDITED from var o = $(this[0]); 
    o.each(function() { 
     var a1top = o.find('.article1').position().top; 
     var a1height = o.find('.article1').height(); 
     var a0top = o.find('.article0').position().top; 
     var a0height = o.find('.article0').height(); 
     var a2top = o.find('.article2').position().top; 
     var a2height = o.find('.article2').height(); 
     var a3height = o.find('.article3').height(); 
     var a4height = o.find('.article4').height(); 
     var a5height = o.find('.article5').height(); 
     if (a0height > a1height + a1top) { 
      $('.article3', o).css('top', a0top + a0height + 20); 
     } else if (a0height < a1height + a1top) { 
      $('.article3', o).css('top', a1top + a1height + 20); 
     } 
     $('.article4', o).css('top', a2top + a2height + 20); 
     $('.article5', o).css('top', a2top + a2height + 20); 
     $('.article6', o).css('top', a2top + a2height + a5height + 40); 
     $('.article7', o).css('top', a2top + a2height + a5height + 40); 
     var lastChildPos = o.find('div:last-child').position().top; 
     var lastChildHeight = o.find('div:last-child').height(); 
     o.height(lastChildPos + lastChildHeight + 20); 
    }); 
};​ 

容器具有一類「.fours」和srcipt在窗口加載時可以很好地工作。但是，當它是一個Ajax的無限滾動負載後調用它無法正確定位下一個「.fours」容器內的絕對的div：

function loadArticle(pageNumber) { 
    $('a#inifiniteLoader').fadeIn('fast'); 
    $.ajax({ 
     url: "wp-admin/admin-ajax.php", 
     type: 'POST', 
     data: "action=infinite_scroll&page_no=" + pageNumber + '&loop_file=loop', 
     success: function(html) { 
      $('a#inifiniteLoader').fadeOut('1000'); 
      $("#content").append(html); // This will be the div where our content will be loaded 
      $('.fours:last').preloader_index(); 
      $('.fours').gridB(); // EDITED from $('.fours:last').gridB(); 
      $('.article a').on({ 
       mouseenter: function() { 
        if (!$('.preloader', $(this).parent('.article')).length > 0) { 
         $(this).stop().css('opacity', '1'); 
        } 
       }, 
       mouseleave: function() { 
        if (!$('.preloader', $(this).parent('.article')).length > 0) { 
         $(this).stop().css('opacity', '0'); 
         $('.article-info', $(this).parent('.article')).stop().fadeTo(200, 0); 
        } 
       } 
      }); 
     } 
    }); 
    return false; 
}​ 

也有一些是錯誤的，但我很接近。如果我把.fours放在最後：當我在ajax成功之後調用函數gridB（）時，腳本只計算忽略高度的div的頂部位置。如果我刪除：最後腳本不計算頂部位置和高度。

任何幫助？

編輯：下面是有關HTML的一個例子。與類另一個DIV

<div id="content"> 
<div class="fours"> 
    <div class="article article0"> 
    <div><img src="url" /></div> 
    </div> 
    <div class="article article1"> 
    <div><img src="url" /></div> 
    </div> 
    <div class="article article2"> 
    <div><img src="url" /></div> 
    </div> 
    <div class="article article3"> 
    <div><img src="url" /></div> 
    </div> 
    </div> 
<!-- Next ".fours" div is loaded here with ajax function --> 
</div> 

編輯2：在gridB函數I改變了線變種O = $（這裏[0]）; var o = $（this）;並修改了函數調用$（'。fours：last'）。gridB（）;到$（'。fours'）。gridB（）;.它的工作，但現在該腳本定位所有絕對div的阿賈克斯內加載下一組與第一組文章的值。我認爲這更接近解決方案。必須有一種方法來定位由ajax加載的容器。 ：最後不起作用。

Answer 1

關於你的最後的編輯，你可以做以下參考上一<div class="fours" />添加的註釋：

success: function(html) { 
    var $html = $(html);      // Wrap HTML in jQuery object. 
    $('a#inifiniteLoader').fadeOut('1000'); 
    $("#content").append($html);    // Add created object. 

    $html.preloader_index();     // Use the same object. 
    $html.gridB();        // Call gridB using the same object.