JSFiddle - React, Tailwind, and code Playground
HTML
<span class="time">between 8:00AM and 13:00PM</span>
<span class="time">between 9:00AM and 14:00PM</span>
<span class="time">between 10:00AM and 15:00PM</span>
<span class="time">between 11:00AM and 16:00PM</span>
CSS
.time { display:block }
.AM { background:#faa }
.PM { background:#afa }
JavaScript
$('.time').html(function(i, v) {
return v.replace(/(AM|PM)/g, '<span class="suffix $1">$1</span>');
});