javascript - Set the same height of all divs in foreach -

i looking way can make divs have same height. have tryed following:

html:

@foreach (var image in model) {     <div class="col-sm-3 test2">         <div class="thumbnail">             <a class="img-responsive" href="~/content/img/@image.imgurl" data-lightbox="roadtrip" data-title="my caption">                 <img class="img-responsive" id="imagethumb" src="~/content/img/@image.imgurl">             </a>             <div class="caption">                 <h3>@image.title</h3>                 <p>@image.imgdesc</p>             </div>         </div>     </div> } 

jquery:

$(document).ready(function () {         $('.test2').each(function () {             var highestbox = 0;             $(this).find('.thumbnail').each(function () {                 if ($(this).height() > highestbox) {                     highestbox = $(this).height();                 }             })             $(this).find('.thumbnail').height(highestbox);         });     }); 

but didn't work? doing wrong?

var hghtarr = []; $(".test2 .thumbnail").each(function() {    hghtarr.push($(this).height()); }); var getmaxhgt = math.max.apply(math,hghtarr); $(".test2 .thumbnail").height(getmaxhgt); 

hope helpful, logic simple.

gather heights under array, find max height, , apply all.