JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td class="td_left"></td>
        <td class="td_right"></td>
    </tr>
    <tr>
        <td class="td_left"></td>
        <td class="td_right"></td>
    </tr>
    <tr>
        <td class="td_left"></td>
        <td class="td_right"></td>
    </tr>
    <tr>
        <td class="td_left"></td>
        <td class="td_right"></td>
    </tr>
    <tr>
        <td class="td_left"></td>
        <td class="td_right"></td>
    </tr>
</table>
<br/>
<table>
    <tr>
        <td>Left</td>
        <td>Right</td>
    </tr>
    <tr>
        <td><input type="text" id="txt_lColor"/></td>
        <td><input type="text" id="txt_rColor"/></td>
    </tr>
    <tr>
        <td>
            <button onclick="changeLeft();">change</button>
        </td>
        <td>
            <button onclick="changeRight();">change</button>
        </td>
    </tr>
</table>

CSS

td
{
    width:65px;
    height: 18px;
    border:1px solid black;
    text-align:center;
}
input[type=text]
{
    width:55px;
}
}

JavaScript

window.changeLeft = function changeLeft(){
        $(".td_left").css("backgroundColor", $("#txt_lColor").val());
};
    
window.changeRight = function changeRight(){
        $(".td_right").css("backgroundColor", $("#txt_rColor").val());
};