jquery - jquery 无法切换嵌套 4 层的图像的可见性，但可以向下切换 3 层

Question

我在 4 个嵌套的 Divs 内有一个 ajaxloader.gif，隐藏的，当 scollbar 触底时，我让它可见并加载更多。

<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>

jQuery

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。但是，如果我将其设为 3 个 div，则它可以工作。我可以很好地做到这一点，但我很好奇为什么会发生这种情况。我错过了什么吗？