title: Cannot get Masonry-Rails Gem to work in my app
body: <p>so I have scoured stackoverflow and found some similar articles but nothing has worked for me yet. I am creating a rails app and I want to use the <a href="http://masonry.desandro.com/" rel="nofollow noreferrer">Masonry</a> for my layout. I have tried uploading the js as described in <a href="https://stackoverflow.com/a/14027048/2949026">this post</a>, but I could not get it to work no matter how many times I tried (yes I matched all the correct IDs and classes). I know the gem is working because the CSS is loading fine, I just cant get the JS to work. Here is what I have at the moment</p>
  
  <p>Gemfile:</p>
  
  <pre><code># masonry layout
  gem 'masonry-rails'
  </code></pre>
  
  <p>application.js:</p>
  
  <pre><code>//= require jquery
  //= require jquery_ujs
  //= require turbolinks
  //= require bootstrap
  //= require_tree . 
  //= require masonry/jquery.masonry  
  </code></pre>
  
  <p>index.html.erb:</p>
  
  <pre><code>&lt;div class="center"&gt;
  
  &lt;div id="masonry-container" class="transitions-enabled infinite-scroll clearfix"&gt;
      &lt;%= render @products %&gt;
  &lt;/div&gt;
  
      &lt;div class="paginator"&gt;
      &lt;%= will_paginate @products, renderer: BootstrapPagination::Rails %&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>_products.html.erb</p>
  
  <pre><code>&lt;div class="box"&gt;
  &lt;% gfyid = product.gfy.to_s.gsub("http://gfycat.com/", "") %&gt;
  &lt;h2&gt;&lt;%= product.name %&gt;&lt;/h2&gt;
  &lt;div class="gfySize"&gt;
      &lt;div class="gfyitem" data-title=false data-autoplay=false data-controls=false data-expand=false data-id="&lt;%= gfyid %&gt;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>I am so lost, I have been working on this for hours trying everything. The CSS is working/looking fine but I am just struggling with the js. Would appreciate any help thank you so much!</p>