JSFiddle - React, Tailwind, and code Playground

HTML

<div id="48" class="box">0</div>
<div id="49" class="box">1</div>
<div id="88" class="box clear">X</div>
<div id="89" class="box">Y</div>

CSS

.box {
  display: block;
  width: 50px;
  height: 50px;
  border: 1px solid black;
  background-color: teal;
  margin: 0 10px 10px 0;
  float: left;
  text-align: center;
  font-weight: bold;
  font-size: 2.8em;
  color: white;
}

.press {
  box-shadow: 2px 2px 2px black inset;
}

.clear {
  clear: both;
}

JavaScript

$(document).keydown(function(e) {
    var codeList = [48, 49, 88, 89];
    var code = e.keyCode || e.which;
    if ($.inArray(code, codeList) !== -1) {
      $("#" + code).addClass("press");
    }
  }).keyup(function() {
        $(".press").removeClass("press");
      });