JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <th>NAME</th>
        <th>00:00</th>
        <th>00:20</th>
        <th>00:40</th>
        <th>01:00</th>
        <th>01:20</th>
        <th>etc</th>
    </tr>
    <tr id="row1">
        <th>item</th>
        <td colspan="2">itemA</td>
        <td colspan="3">itemAB</td>
    </tr>
    <tr>
        <th>item</th>
        <td colspan="3">itemAB</td>
        <td colspan="2">itemA</td>
    </tr>
    <tr>
        <th>item</th>
        <td colspan="2"></td>
        <td colspan="2">itemABC</td>
    </tr>
</table>

CSS

table {
    background-color: black;
    border-collapse: collapse;
}
table th, 
table td {
    background-color: white;
    padding: 2px;
}

JavaScript

$("td:contains('itemA')").css("background-color", "lightBlue");
$("td:contains('itemAB')").css("background-color", "yellow");
$("td:contains('itemABC')").css("background-color", "lightGreen");
$("td:empty").css("background-color", "Black");