How QUIQLY find words in page using 1000+ Data and then add css to surrounded tag by RegEx and Replace?

As I mentioned, the problem is with RegEx request. Using "\b"+word+"\b" as it is now, my page loads with approximately additional 1s, but in that way I also replace words in input, img(src), or a(href) tags in my page. Therefore, I tried more complex RegExp requests like that : "(?: |<(?:a|p|h1)(?:.*>))("+word+")(?: |</(?:a|p|h1)>)" that worked quite properly, but page loaded about 30s with all my brands!

Check this RegEx it in the link: https://regex101.com/r/U7nT9R/1

Code works so:

1. Get code from page body
2. Save it into var $golbalhtml
3. Map function through all words in data
4. -- Each time request new word RegEx and replace common words in var $golbalhtml with all my code
5. When MAP finished => PUBLISH by .html($golbalhtml)

How I can check all my data immidiately?(is it possible to make request without map function in once?) OR Should I use some RegEx request that is more simple? Does there are any other methods to find word easily in page and replace by <>word</>?

$golbalhtml = $("body").html(); //START

$.map( data, function( word, i ) {
    let brand = "\\b"+word+"\\b"; //here
    let re = new RegExp(brand,"g");

    $golbalhtml = $golbalhtml.replace(re,"<span style='...'>"+word+"</span>");      
});

$("body").html($golbalhtml); //END

My Result PHOTO of REPLACE() just in Google page with word(brand name) "AHAVA" - it works through Google Chrome Expanssion: PHOTO RESULT