<html>
<head>
<style>
#tb1 {
position:absolute;
left:0px;
top:0px;
width:960px;
height:540px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<div id="tb1" style="margin:10px">
<table width="400" border="1" >
<tr>
<td> </td>
<td><div id="up">UP</div></td>
<td> </td>
</tr>
<tr>
<td><div id="left">LEFT</div></td>
<td> </td>
<td><div id="right">RIGHT</div></td>
</tr>
<tr>
<td> </td>
<td><div id="down">DOWN</div></td>
<td> </td>
</tr>
</table>
</div>
<script>
$(document).keydown(function(event) {
switch (event.keyCode) {
case 37: console.log('left key pressed'); break;
case 38: console.log('up key pressed'); break;
case 39: console.log('right key pressed'); break;
case 40: console.log('down key pressed'); break;
}
});
$('#up').css('background-color', 'red');
</script>
</body>
</html>