JSFiddle - React, Tailwind, and code Playground
HTML
<div id="DaySchedule_5amDetail">
<span> </span>
</div>
<div id="DaySchedule_6amDetail">
<span> </span>
</div>
<div id="DaySchedule_7amDetail" class="start"> <-- start
<span> </span>
</div>
<div id="DaySchedule_8amDetail">
<span> </span>
</div>
<div id="DaySchedule_9amDetail">
<span> </span>
</div>
<div id="DaySchedule_10amDetail" class="end"> <-- end
<span> </span>
</div>
<div id="DaySchedule_11amDetail">
<span> </span>
</div>
CSS
.wrapper{ padding:5px; border: 1px solid green}
JavaScript
/* add ID's to span text for visual reference*/
$('span').text(function(){
return this.parentNode.id
})
$('.start').each(function(){
$(this).nextUntil('.end').wrapAll('<div class="wrapper">');
})