title: Build Masonry layout with filter and ajax Load More option Using Jquery Masonry
body: <p>I'm using <a href="http://masonry.desandro.com/index.html" rel="nofollow">jquery masonry</a> in my project, where i need to make layout with filter such as category1, category2, category3 and all. And also need the ajax load more option for add more elements in the layout.</p>
  
  <p>All is done means ajax is working good with the db and masonry layout. But the filter is not working with ajax (Filter is working without ajax). I'm using here another script which is founded on github <a href="https://github.com/dynamick/multiple-filter-masonry" rel="nofollow">here the link know as multiple-filter-masonry</a></p>
  
  <p>Here's my js code...</p>
  
  <pre><code>// Start Masonry
  var $container = $('.posts.load-more').multipleFilterMasonry({
  // columnWidth: 150,
  itemSelector: '.post',
  filtersGroupSelector:'.filters',
  isAnimated: true
  // gutter: 20,
  // isFitWidth: true
  });
  
  // Get some more blocks
  $('#more').click(function(){
  // $('.loader').show();
  $start = $('.posts.load-more .post').length;
  $end = 6;
  $.post('blocks.php', {start: +$start, end: +$end}, function(data){
    // $('.loader').hide();
  
    // make jQuery object
    var $moreBlocks = $( data );
    // Append new blocks
    $container.append( $moreBlocks );
  
    // Have Masonry position new blocks
    $container.masonry( 'appended', $moreBlocks );
  });
  </code></pre>
  
  <p>Hope someone having the solution for that... or suggest me any idea to complete this.</p>
  
  <p>Thanks in advance</p>