JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/ui-lightness/jquery-ui.css">
<div class="wrapper">
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
</div>
<div class="wrapper">
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
</div>
<div class="wrapper">
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
<a href="#"><img src="#" /></a>
</div>
CSS
.slide{
border: 2px dashed orange;
margin: 4px;
}
JavaScript
$('.wrapper > a:nth-child(5n+1)').each(function() {
$(this).nextAll('a:lt(4)').addBack().wrapAll('<div class="slide"></div>');
});