如何使用jquery在HTML5中设置表格单元格的背景和字体颜色

<script src="https://cdn.jsdelivr.net/jquery/3.6.0/jquery.min.js"></script>

<table>
  <tr>
    <td id="cell1">Cell 1</td>
    <td id="cell2">Cell 2</td>
  </tr>
  <tr>
    <td id="cell3">Cell 3</td>
    <td id="cell4">Cell 4</td>
  </tr>
</table>

<script>
  $(document).ready(function() {
    // 设置单元格背景色
    $("#cell1").css("background-color", "red");
    $("#cell2").css("background-color", "blue");
    $("#cell3").css("background-color", "green");
    $("#cell4").css("background-color", "yellow");
    
    // 设置单元格字体颜色
    $("#cell1").css("color", "white");
    $("#cell2").css("color", "white");
    $("#cell3").css("color", "white");
    $("#cell4").css("color", "white");
  });
</script>