JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
  <style>
    .highlight{background:red}
  </style>
</head>
<body>
  <form id="searchform" action="<?php echo $searchURL ?>" method="get">
    <input id="searchbox" type="text" name="q" autocomplete="off" value=""/>
    <button id="submit-search-button" type="submit"></button>
  </form>
  <script>
        var itemNames = ['Red Apple','Green Apple','Blue Apple'];
                
        $('#searchbox').autocomplete({
            source: itemNames,
            autoFocus: false,
            focus: function(event, ui) {
                $("ul.ui-autocomplete li.ui-menu-item a").removeClass("highlight");
                $("ul.ui-autocomplete li.ui-menu-item a").filter(function(index) {return $(this).text() == ui.item.value}).addClass("highlight");;
            }
        });
            </script>
  
</body>
    </html>