JSFiddle - React, Tailwind, and code Playground

by Ilya Karpuk

HTML

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

<ul>
<li>
<button class="name">Сярожа</button> 
</li>
<li>
<button class="name">Илья</button> 
</li>
<li>
<button class="name">Паша</button> 
</li>
</ul>

JavaScript

var input = document.getElementById('input');
input.onkeyup = function () {
    var filter = input.value.toUpperCase();
    var lis = document.getElementsByTagName('li');
    for (var i = 0; i < lis.length; i++) {
        var name = lis[i].getElementsByClassName('name')[0].innerHTML;
        if (name.toUpperCase().indexOf(filter) == 0) 
            lis[i].style.display = 'list-item';
        else
            lis[i].style.display = 'none';
    }
}