JSFiddle - React, Tailwind, and code Playground

by Bhavin Surela

HTML

<input type="text" id="search-dropdown" class="input-control"><br>
    <select id="test" class="input-control dropdown">
</select>

CSS

#search-dropdown, .dropdown{
    margin:0px;
}

JavaScript

var option ="<option value='replaceme' class='replaceme option-element'>replaceme</option>";

var load = function(){
    for(var i =0;i<10000;i++)
    {
        var html = option.replace(/replaceme/g,i);
        jQuery("#test").append(html);
    }
    
    jQuery("#search-dropdown").change(function(){
        
        var text=    jQuery("#search-dropdown").val();
        if(text == ""){
            jQuery(".option-element").hide();        
            jQuery(".option-element[value*='"+text+"']").show();
        }else{
               jQuery(".option-element").show();        
        }
        
        
     });

};

load();