JSFiddle - React, Tailwind, and code Playground

HTML

<h4>Try searching for "lorem", "kitty" etc</h4>

<input type="text" id="searchkeyword"/><button id="search_button">Search</button>
<br />
<div id="search_results"></div>

<div id="pool">
    <p>Lorem Ipsum</p>
    <p>Hello kitty</p>
    <p>stack overflow</p>
    <p>google is a search engine</p>
</div>

CSS

#pool {display: none;}
.red {color: red}

JavaScript

$("#search_button").on('click', function(e){
    e.preventDefault();

    var keyword = $("#searchkeyword").val().toLowerCase(),
        paras   = $('p').filter(function() {
                     return $(this).text().toLowerCase().indexOf(keyword) != -1;
        }).html(function(_, html) {
            var reg = new RegExp('(' + keyword + ')', 'gi');
            return html.replace(reg, "<span class='red'>$1</span>");
        });

    $('#search_results').html(paras);
});