Javascript 在ajax上调用加载更多加载gif仅对最初出现的div有效

//ajax加载更多

$(document).on( 'click', '.loadmorebutton', function() {
 $(this).parent().find(".loadmore").show();  
  $.ajax({
    type: "post",
    url: "something.php",
    data: variable,
    dataType: "text",                  
    success: function(data) { 
        $items = $(data); 
        $grid.append( $items )
        .masonry( 'appended', $items );
        $(this).parent().find(".loadmore").hide();   
    }.bind(this)
  });
}); 

上面的ajax代码用于从something.php文件中获取数据，然后将结果附加到布局中

//ajax获取完整内容

$(document).on( 'click', '.loadmorecontent', function() {
      $(this).parent().find(".loadingdata").show();
      $.ajax({
          type: "post",
          url: someother.php,
          data: morevariable,
          dataType: "text",                  
          success: function(response) {
            $(this).parent().find(".loadingdata").hide();
          }.bind(this)
      });

现在，每当单击loadmorecontent时，都应该调用这个ajax，并且应该显示loadingdata gif，直到成功为止。它对于最初出现的div可以正常工作，但对于随后由LoadMoreButton单击创建的附加div则不行

---

在任何情况下，当您需要在第一时间执行某些操作（如click event或任何其他操作）时，甚至在新的div获得append之后，我如何使每个div都发生这种情况，无论是最初出现还是之后追加，然后只需为该click event创建一个函数，并在需要时调用该函数即可

---

它也适用于新添加的div。

这是因为您的代码只是将事件绑定到当前页面中的元素。因此，当事件添加到页面时，必须将其绑定到新元素