JSFiddle - React, Tailwind, and code Playground
HTML
<span class="key" id="Q">Q</span>
<span class="key" id="W">W</span>
<span class="key" id="E">E</span>
<span class="key" id="R">R</span>
<span class="key" id="T">T</span>
<span class="key" id="Y">Y</span>
<br>
<textarea id="input"></textarea>
CSS
.key { background-color: red}
.trigger { background-color: green}
JavaScript
$(function () {
$("#input").keydown(function (event) {
$("#" + String.fromCharCode(event.which)).addClass("trigger");
}).keyup(function (event) {
$("#" + String.fromCharCode(event.which)).removeClass("trigger");
});
});