JS - Highlight all matches to search input on Enter.

highlight-words-on-search.js

// From: https://codingartistweb.com/2021/06/highlight-searched-text-with-javascript/
function search() {
  // Use the id of the input ex: text-to-search
  let textToSearch = document.getElementById("text-to-search").value;
  // Use the id of the source to be searched ex: paragraph
  let paragraph = document.getElementById("paragraph");
  // Characters in search input to be escaped: [.*+?^${}()|[\]\\]
  textToSearch = textToSearch.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");

  let pattern = new RegExp(`${textToSearch}`, "gi");

  paragraph.innerHTML = paragraph.textContent.replace(pattern, match => `<mark>${match}</mark>`);
}