JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" name="subject" id="my_input"/>
<ul>
<li><a href="#">English</a></li>
<li><a href="#">General English</a></li>
<li><a href="#">Business English</a></li>
<li><a href="#">French</a></li>
<li><a href="#">Russian</a></li>
<li><a href="#">German</a></li>
</ul>
<span id="label"></span>

CSS

ul{
  list-style:none;
}

JavaScript

$("ul li a").click(function(){
	$("input#my_input").attr("value", $(this).text());
  $("span#label").html($(this).text());
})

$("input#my_input").keyup(function(){
	var text = $(this).val();
  $("ul li").each(function(){
    if ($(this).text().search(new RegExp(text, "i")) < 0) {
      $(this).fadeOut();
    } else {
      $(this).show();                
    }
  });
})