JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.jinkou.info/js/jQuery/jQuery.masonry.js"></script>
<div class="custom">
    <div id="pinboard-wrapper"?
        <ul class="pinboard-list"></ul>
    </div>              
</div>

CSS

.custom .pinboard-item {
  width: 130px;
  margin: 10px;
  float: left;
  border:#6e6e6e solid 1px;
  border-radius:5px;
  padding:6px;
  
}

.custom #pinboard-wrapper{
    margin: 0 auto;
    width: 85%;
}

.custom .pinboard#results li.grid-item{
    height:auto;
    width:88px;
    float:left;
    margin:10px
}

.custom .pinboard#results .grid-item .grid-title{
    height:auto
}

.custom .pinboard#results .grid-item .grid-image img{
    height:77px;
}

.masonry,
.masonry .masonry-brick {
  -webkit-transition-duration: 0.7s;
     -moz-transition-duration: 0.7s;
      -ms-transition-duration: 0.7s;
       -o-transition-duration: 0.7s;
          transition-duration: 0.7s;
}

.masonry {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.masonry .masonry-brick {
  -webkit-transition-property: left, right, top;
     -moz-transition-property: left, right, top;
      -ms-transition-property: left, right, top;
       -o-transition-property: left, right, top;
          transition-property: left, right, top;
}

JavaScript

$(document).ready(function(){
    $('.pinboard-list').masonry({
        itemSelector : '.grid-item',
    });
    getitems();
})
    
function getitems(){
    for(var i=0; i<50; i++){
        renderitems();
    }
}

function renderitems(){
        boxes = $('<li height="102" width="135" class="grid-item"><div class="grid-image"><a href="http://www.jinkou.info/campbell-s-condensed-cream-of-mushroom-soup-300g"><img src="http://www.jinkou.info/media/catalog/product/cache/3/small_image/88x77/9df78eab33525d08d6e5fb8d27136e95/c/a/cambellsmushroom.jpg" alt="Campbells Condensed Cream of Mushroom Soup 300g"></a></div><div class="grid-title"><a href="http://www.jinkou.info/campbell-s-condensed-cream-of-mushroom-soup-300g">Campbells Soup 300g</a></div></li>');
    $('.pinboard-list').append(boxes).masonry('appended',boxes,true);
}