JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>BOB BOPE</li>
   <li>BOB TEST</li>
    <li>BOB BONES</li>
    <li>BOB BOBS</li>
    <li>TEST MCBRIDEG</li>
</ul>
<br>
Search: <input id="search" class="search" length="24" />
Refine    <input id="refine" class="search" length="24" />

JavaScript

$(document).ready(function(){
    $(".search").keyup(function(){
        $("li").hide();
      
        if($("#refine").val()!=""){
        var term = $("#search").val().toUpperCase()+" "+$("#refine").val().toUpperCase();
        }else{
        var term =$("#search").val().toUpperCase();

        }
        $("li:contains('" + term + "')").show();

    }); 

});