title: Masonry destroy and initialize again
body: <p>I have initialize masonry plugin - works OK,</p>
  
  <p>than I destroy it for media width &lt;= 767px - it was destroyed</p>
  
  <p>but when I return back to media width > 767px and initialize masonry again it doesn't work.</p>
  
  <p>why?</p>
  
  <p>or is there any another solution to turn off masonry plugin and later turn it on on some event?</p>
  
  <p>this is my code:</p>
  
  <pre><code>var masonryData = {
      isInitLayout: true,
      isResizeBound: false,
      itemSelector: '.item',
      columnWidth: 300,
      gutter: 20,
      transitionDuration: '0.5s'
  };
  
  function initializeMasonry(masonryData){
      if (jQuery().masonry) {
          var masonryContainer = jQuery('.masonry').masonry(masonryData);
          jQuery(masonryContainer).imagesLoaded(function(){
              jQuery(masonryContainer).masonry(masonryData);
          });
      }
  }
  
  function destroyMasonry(){
      if (jQuery().masonry) {
          jQuery('.masonry').masonry();
          jQuery('.masonry').masonry('destroy');
      }
  }
  </code></pre>
  
  <p>I'm using enquire plugin so I use match/unmatch methods for js media queries:</p>
  
  <pre><code>$.Site.Match.smallScreen = function() {
     ...
     destroyMasonry();
     ...
  }
  
  $.Site.Match.mediumScreen = function() {
     ...
     initializeMasonry(masonryData);
     ...
  }
  </code></pre>
  
  <p>Many thanks for help</p>