JSFiddle - React, Tailwind, and code Playground
HTML
<input type='text' id='id1' class='class1'>
JavaScript
function searchLatterInString(arr, id){
$('#'+id).css('display','block').attr('autocomplete','off');
//$('#'+id).on('focus keyup', function(){
if($('.autoCompleteInput_'+id).length==0) {
$('<div class="autoCompleteInput autoCompleteInput_'+id+'" style="width:'+(($('#'+id).width())*1+20*1)*1+'px;">').insertBefore('#'+id);
$('#'+id).appendTo('.autoCompleteInput_'+id);
$('#'+id).after('<div class="dropDownList dropDownList_'+id+'" style="width:'+$('#'+id).css('width')+';"></div>');
}else {
$('.dropDownList_'+id).show();
}
$('.dropDown_'+id).remove();
for (var i in arr) {
if ((arr[i].indexOf($('#'+id).val())!==-1)&&(arr[i]!=='')) {
$('.dropDownList_'+id).append('<div class="dropDown dropDown_'+id+'">'+arr[i]+'</div>');
}
}
$('.dropDown_'+id).on('mouseenter', function(){
$(this).on('mousedown', function(){
$('#'+id).val( $(this).html()).trigger('change');
$('#'+id).trigger('inputChanged');
});
});
//});
$('#'+id).on('inputChanged', function(){
$('.dropDownList_'+id).hide();
});
}