JSFiddle - React, Tailwind, and code Playground

HTML

<label class="fg-label">Type here to search</label>
<input type="text" id="video-search-text" class="form-control"/>

<div class="video-search"><h1>abc</h1></div>
<div class="video-search"><h1>def</h1></div>
<div class="video-search"><h1>ghi</h1></div>
 <h3 style="margin-top: 25px;border: 2px solid red" id="no-results" style="display: none">No results found</h3>

CSS

h1 {font-size:20px;font-weight:bold}
body {margin: 10px}

JavaScript

$('#no-results').hide();
        $('#video-search-text').keyup(function () {
            $('.video-search').hide();
            $('#no-results').css("display", "none");
            var txt = $('#video-search-text').val(); 
            
            $('.video-search').each(function () {
                if ($(this).text().toUpperCase().indexOf(txt.toUpperCase()) != -1) {
                    $(this).show(); 
                   
                }
                else {
                      $('#no-results').css("display", "block");
                      
                }
            });
           
        });