<!-- FIND, STYLE AND REPLACE MATCHING STRINGS -->
<script>
document.addEventListener('DOMContentLoaded', () => {
const selector = 'h1, p, li' // Separate HTML, Class or ID Selectors with commas
const identifier = 'Find me' // String you want to find and wrap
const replacementString = '' // Leave blank if you want to keep original string
const addClassToIdentifier = 'identifier' // Class that gets added to the span for styling
// No need to touch anything below
const pattern = new RegExp(`\\b(${identifier})`, 'gi');
const replacement = !replacementString ? `<span class="${addClassToIdentifier}">$1</span>` : `<span class="${addClassToIdentifier}">${replacementString}</span>`;
Array.from(document.querySelectorAll(selector)).forEach((element) => {
element.innerHTML = element.innerHTML.replace(pattern, replacement);
});
});
</script>
Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.