JSFiddle - React, Tailwind, and code Playground

HTML

<form class="search-form">
  <label class="keyword-search-input-label" for="keyword-search-input">
    <span class="hide">Search</span>
    <input class="form-control" type="text" id="keyword-search-input" name="keyword"/>
  </label>

  <button id="clear-field-button" type="reset">
    <span class="hide">Clear Search Field</span>
  </button>
  <button id="search-button" type="submit" aria-describedby="number-found-items">
    <span class="symbol-label">Search</span>
  </button>
</form>
<div id="number-found-items" role="status" aria-live="assertive" aria-atomic="true" aria-relevant="all">
  <span id="number-found">0</span>
  items found
</div>

JavaScript

var $numberFound = $('#number-found');

$('#search-button').on('click', function(event) {
  event.preventDefault();

  window.setTimeout(function() {
    var value = getRandomInt(0, 100);
    updateNumberFound(value);
  }, 1000);
});

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

function updateNumberFound(value) {
  $numberFound.text(value || 0);
}