JSFiddle - React, Tailwind, and code Playground
HTML
<div id="project">
<ul id="new">
<li> <img src="#" />New 1 </li>
<li> <img src="#" />New 2 </li>
<li> <img src="#" />New 3 </li>
<li> <img src="#" />New 4 </li>
<li> <img src="#" />New 5 </li>
</ul>
<ul id="old">
<li> <img src="#" />Old 1 </li>
<li> <img src="#" />Old 2 </li>
<li> <img src="#" />Old 3 </li>
<li> <img src="#" />Old 4 </li>
</ul>
</div>
CSS
#project li {
width:60px;
margin-right:25px;
margin-bottom:50px;
height:auto;
}
#project ul {
float:left;
width:100px;
margin-right:50px;
}
JavaScript
$(function () {
$('#new li').each(function() {
theHeight = $(this).height();
$('#old li').each(function() {
$(this).append(theHeight + ' ');
});
});
});