JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="kbdhook" />

<div id="result" >1: </div>

<div id="result2" >2: </div>

<div id="result3" >3: </div>

JavaScript

$('#kbdhook').keyup(function(event) {
          var current = $('#kbdhook').val();
          if (current !== '' && current !== '\n') {
            var c, l;
            for (l = 0; l < current.length; l++) {
              c = current[l];
              $("#result").html($("#result").html() + c);
            }
            
            $("#result2").html($("#result2").html() + " " + $('#kbdhook').val());
            $('#kbdhook').val('');
            $("#result3").html($("#result3").html() + " " + $('#kbdhook').val());
          }
      });