<input type="text" id="display" disabled>
  <div class="keyboard">
    <button id="Q">Q</button>
    <button id="W">W</button>
    <button id="E">E</button>
    <button id="R">R</button>
    <button id="T">T</button>
    <button id="Y">Y</button>
  </div>
  <script>
    var display = document.getElementById('display');
    console.log("TCL: display", display)
    var buttons = document.getElementsByClassName('keyboard')[0].children;
    console.log("TCL: buttons", buttons)
    for (let button of buttons) {
      button.addEventListener('click', function (e) {
        console.log("TCL: this", this.innerText)
        display.value += this.innerText;
      });
    }
  </script>