JSFiddle - React, Tailwind, and code Playground

by Erkan Er

HTML

<input type="text" id="searchcity">
<div id="citysname"> <a href="#" id="place" class="kathmandu">Kathmandu</a>
 <a href="#" id="place1" class="bhaktapur">bhaktapur</a>
 <a href="#" id="place2" class="Narayangarh">Narayangarh</a>
 <a href="#" id="place3" class="lalitpur">lalitpur</a>
 <a href="#" id="place4" class="something">something</a>
 <a href="#" id="place5" class="hello">hello</a>

</div>

CSS

.highlight {
    background-color:yellow;
}

JavaScript

$(document).ready(function () {

    $(document).on("keyup", "#searchcity", function () {
        var city = $(this).val();
        if (city.trim().length) {
            $("#citysname").find("a").each(function () {
                if ($(this).attr('class').indexOf(city) > -1) 
                    $(this).addClass('highlight');
                else $(this).removeClass('highlight');
            });
        } else $("#citysname a").removeClass('highlight');

    });
});