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>');
});