Capture the search phrase. Capture the search area.
Replace the searched word, with the same word, place wrapped in a span that has certain CSS class. Use CSS to customize the look.
$("#buttonclick").on("click", function() { var toFind = $("#toFind").val(); var toLookInto = $("#toLookInto").html(); var regx = new RegExp(toFind, "g"); var newstring = toLookInto.replace(regx, '<span class="highlight">' + toFind + '</span>') $("#toLookInto").html(newstring) }); .highlight { color: red; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <p id="toLookInto"> dummy text foo bar cat mewo dummy text foo bar cat mewo dummy text foo something odd bar cat mewo dummy text foo bar cat mewo </p> <br> <input type "text" id="toFind" /> <button id="buttonclick"> Find </button>