将砌体类添加到Jquery html字符串

我正在尝试使用jquery查找和替换html数据。jquery脚本正在工作，事实上它正在从one div容器获取html数据，并用新数据替换它。问题是在重新加载时，它复制了容器类，而没有添加计算以下div所需的砌筑砖类

以下是JQuery：

$("div.more a").on("click", function (event) {
   event.preventDefault();
   // get the contents
    $.get(this.href, function (response) {
        // jquerify the response HTML string and find our replaceable area
        var result = $(response).find('.l-home-grid');
        // do the replace
        $('.l-home-grid').html(result);
    });
  // Revert all to original state
  $("a.active")
    .removeClass("active")
    .addClass("static");
  // Set classes to clicked anchor
  $(this)
    .removeClass("static")
    .addClass("active");

  window.location.hash = $(this).text();
});

这将导致html：

<div class="mobile-padding l-home-grid masonry" style="position: relative; height: 2660px; ">
  <div class="mobile-padding l-home-grid">
    <div class="gridCells"><a href="#">
      <h4>Things</h4>
      <img width="256" height="182" src="foo.jpg"> </a></div>
    <div class="gridCells"><a href="#">
      <h4>More Things</h4>
      <img width="256" height="182" src="foo.jpg"> </a></div>
    <div class="gridCells"><a href="#">
      <h4>Objects</h4>
      <img width="256" height="182" src="foo.jpg" > </a></div>
  </div>
</div>

为什么会这样

<div class="mobile-padding l-home-grid masonry" style="position: relative; height: 2660px; ">
      <div class="mobile-padding l-home-grid"> 

装载两次

目标是：

<div class="mobile-padding l-home-grid masonry" style="position: relative; height: 2660px; ">
    <div class="gridCells masonry-brick"><a href="#">
      <h4>Things</h4>
      <img width="256" height="182" src="foo.jpg"> </a></div>
   ...

...

发生这种情况是因为您正在将响应中的整个

.l-home-grid

元素添加到现有的

.l-home-grid

元素中。更改此行：

var result = $(response).find('.l-home-grid');

为此：

var result = $(response).find('.l-home-grid').html();

以便只将响应内容添加到容器中。你可能需要打电话

$('.l-home-grid').masonry('reload');

---

在您拉入新内容以确保其被激活后。

发生这种情况是因为您正在将响应中的整个

.l-home-grid

元素添加到现有的

.l-home-grid

元素中。更改此行：

var result = $(response).find('.l-home-grid');

为此：

var result = $(response).find('.l-home-grid').html();

以便只将响应内容添加到容器中。你可能需要打电话

$('.l-home-grid').masonry('reload');

在你拉入你的新内容，以确保它得到充分利用