isotope Append Issue (overlapping)

Example

function load_more(){
  var $wrap = $('#items-wrap');
  var $last = $wrap.find('.grid-item:last');
  var last_index = $last.data('index');
  //console.log(last_index);

  var params = {
    index: last_index
  }

  $.ajax({
      type: 'get',
      url: base_url + '/video/more',
      data: params,
      dataType: 'html',
      success: function(data){
          //This is key
          $data = $(data);
          //$wrap.append(data);
          var c = $wrap.isotope();

          c.append($data)
            .isotope("appended", $data)
            .imagesLoaded().progress(function () {
              c.isotope("layout");
            });

          c.isotope("reLayout");

          $('#load_more').removeClass('disabled');
      },
      error: function(data){
          console.log(data);
          var errors = data.responseJSON;
          show_response_error(errors);
      }
  });
}
  • Try wrapping response data as jQuery object

Reference: