JSFiddle - React, Tailwind, and code Playground

HTML

<input id = "search" type ="text" value = "what">
<div class = "searchable">what the shit is going on here what I don't know what this is</div>

CSS

.highlight{
             font-weight:bold;
             color:green;
}

JavaScript

var term = $('#search').val().trim().toLowerCase();
if (term.length > 0) {
    var source = $('.searchable').text();
    var words = source.split(' ');
    var output = '';
    $.each(words, function(idx, word) {
        if (term === word.toLowerCase()) {
            output += '<span class="highlight">' + word + '</span> ';
        } else {
             output += word + ' ';   
        }
    });
    
    $('.searchable').html(output);
}