Javascript 在同一页面上的多个搜索框上动态应用Jquery中的搜索筛选器

我在同一页上有多个搜索输入框，其中包含我要搜索的不同列表

我的问题是，当我在一个搜索框中搜索时，它适用于所有其他搜索框，所有其他搜索框也会被搜索。我希望它特定于用户搜索的字段

这里是小提琴链接：

HTML

---

为您的输入提供一个ID，并将处理程序附加到该ID上：

项目1
项目2
项目3


项目27
项目28

我已经使用了id并进行了检查，但未进行更新。您需要告知您需要过滤哪个ul，此时您正在过滤页面上的每个li。。。。使用你给UL更新的提琴的ID：Heyya有没有一种方法可以使它更优化，并且只有一个功能可以动态地使用ID？当然，但是你应该真正调查并学习如何做到这一点，如果你被卡住了，发布你的代码，我们可以帮助你：）

<ul id="category1">
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
</ul>
<ul>
    <li>item27</li>
    <li>item28</li>
</ul>

$(function(){

    $('input[type="text"]').keyup(function(){

        var searchText = $(this).val();

        $('ul > li').each(function(){

            var currentLiText = $(this).text(),
                showCurrentLi = currentLiText.indexOf(searchText) !== -1;

            $(this).toggle(showCurrentLi);

        });     
    });

});

$(function(){

  $('#searchInput').keyup(function(){

    var searchText = $(this).val();

    $('ul > li').each(function(){

        var currentLiText = $(this).text(),
            showCurrentLi = currentLiText.indexOf(searchText) !== -1;

        $(this).toggle(showCurrentLi);

    });     
  });

});

<input type="text" id="searchInput" />

<ul id="category1">
  <li>item1</li>
  <li>item2</li>
  <li>item3</li>
</ul>
<ul>
  <li>item27</li>
  <li>item28</li>
</ul>