在 jQuery 中添加图像

我正在尝试制作国际象棋游戏，实际上才刚刚开始学习jquery。我制作了一个 8*8 的板，我正在尝试在右下角的起始位置添加一个车，我该怎么做？我尝试为图像制作一个 css 并添加为 id。

.HTML 棋

<h1> Game Board </h1>
<table id="gameBoard">
<tbody></tbody>
</table>
<img id="whiterook">
</img>
<footer>
This is an example of creating a chess Game.
</footer>
<script src="js/jquery-3.0.0.min.js"></script>
<script src="js/chess.js"></script></body>
</html>

.JS

$(function() {
 var row = new Array(9).join('<td></td>');
 var body = new Array(9).join('<tr>' + row + '</tr>');
 });

.CSS

#gameBoard {
 border-collapse: collapse;
 border: solid 1px black;
}
#gameBoard td {
  width: 50px;
  height: 50px;
}
#gameBoard tbody tr:nth-child(2n+1) td:nth-child(2n) {
  background-color: black;
}
#gameBoard tbody tr:nth-child(2n+2) td:nth-child(2n +1) {
  background-color: black;
}
#whiterook{
background-image: url(../images/Chess_tile_rl.png);
width: 40px;
height: 40px;
top:300px;
}