JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://masonry.desandro.com/jquery.masonry.min.js"></script>
<div class="imagecontainer"></div>

CSS

.imagecontainer{
    width:1000px;
}
.imagecontainer img{
    margin:5px;
    float:left;
    border:2px solid #ff0000;
    background:#cccccc;
}
.imgwrap{
    display:inline-block;
    border:1px solid #ffff00;
}

JavaScript

var elements = '';
var ELEMENT_COUNT_PER_PAGE = 50;
var page = 2;

for (var i = (ELEMENT_COUNT_PER_PAGE * (page - 1)); i <= (ELEMENT_COUNT_PER_PAGE * page); i++) {
    var rnd = Math.floor(Math.random() * (300 - 100 + 1)) + 100;
    elements+= '<div class="imgwrap"><img src="lq/'+i+'.jpg" class="image-'+i+'" style="height:'+rnd+'px;"/></div>'
}

$('.imagecontainer').append(elements).masonry();