JSFiddle - React, Tailwind, and code Playground

HTML

<p>
    <label>city:</label>
    <input type='text' name='cityName' value='$cityName' id='keyword_city' autocomplete='off' /> <div id='ajax_response_city' class='ajax_response'><li><a href='javascript:void(0);' data-id="someID">test</a></li></div>

    <input type='hidden' name='cityID' value='$cityID' id='keyword_cityID'>
</p>

JavaScript

$("#ajax_response_city").mouseover(function(){
    $(this).find("li a").mouseover(function () {
          $(this).addClass("selected");
    });
    $(this).find("li a").mouseout(function () {
          $(this).removeClass("selected");
    });
    $(this).find("li a").click(function () {
          $("#keyword_city").val($(this).text());
          $("#keyword_cityID").val($(this).data().id);
          $("#ajax_response_city").fadeOut("slow");
    });
});