jquery - jquery は 4 レベル下にネストされた画像の可視性を切り替えることはできませんが、3 レベル下では機能します

Question

ネストされた 4 つの Div 内に ajaxloader.gif があり、非表示になっています。スクロールバーが底に達したら、それを表示してさらに読み込みます。

<div class="doc-section clearfix" id="grid" style="margin-bottom:60px;">
  <div class="example-grid">
    <div class="four columns alpha" style="padding:4px;background-color:#FFC;">
      <div id="LoaderOverlay"  style="display:none;"  align="center">
     <img src="../images/ajax-loader.gif" />
      </div>
      </div>
  </div>  
</div>

Jクエリ

function onScroll(event) {
   // Check if we're within 100 pixels of the bottom edge of the broser window.
   var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 200);
   if(closeToBottom) {
    $('#myFeed li:last').each(function() 
          { 
        $("#LoaderOverlay").show();
        getMore(ID);

      });
  }
};

 $(document).ready(new function() {
      // Capture scroll event.
      $(window).bind('scroll', onScroll);
    });

奇妙なことに、4 div 内で Gif をオンにすることはできません。しかし、3divにするとうまくいきます。私はそうすることができますが、なぜこれが起こるのか興味があります。何か不足していますか？