JSFiddle - React, Tailwind, and code Playground

HTML

<table id="table1">
    <tr>
       <td>Services</td>
       <td>Department</td>
       <td>  Unit</td>
      <td>IsActive</td>
      <td>Edit</td>
    </tr>
    <TR>
            <TD class="select" height="40%">
                <select name="meal" id="meal" onChange="changecat(this.value)">
                <option value="" disabled selected>Select Options</option>
                    <option value="B">A</option>
                    <option value="B">B</option>
                    <option value="C">C</option>
                </select>
                <TD class="select" height="40%">
                <select name="category" id="category">
                    <option value="" disabled selected>Select Options</option>
                </select>

           <input type="checkbox" id="myCheck">
                <p id="text" style="display:none"></p>
                </TD>
                <TD ALIGN="center">
                <p><a href="https://www.w3schools.com/html/">Edit</a></p>
                </TD>
           </TR>
</table>

CSS

#table1 { background: gray; }
td { border: 1px solid black; text-align:center; color:white; font-weight:bold; }

JavaScript

for (var i = 0; i < 11; i += 1) {
    $("#table1").append("<tr><td>" + i + "</td></tr>");
}