JSFiddle - React, Tailwind, and code Playground

HTML

<p>In this copy is the word hello</p>
<p>In this copy is the <a href="">word</a> hello</p>
<p>In this copy is the <a href="">word hello</a></p>

CSS

a, a:visited, a:hover, a:active { color: green; }

JavaScript

$(function () {    
    
    function changeToLink (sel, txt) {
       var regEx = new RegExp(txt, 'g');
       $.each($(sel), function (i, el) {
           var linkHTML = $(el).html();
           var idx = linkHTML.indexOf(txt);
           
           if (idx >= 0) {
               var t = linkHTML.substring(idx);
               t = t.replace(/<\/?[A-Z]+.*?>/g, function (m) { return m.toLowerCase(); })
               var closingA = t.indexOf('</a>');
               
               t = t.substring(0, closingA);
               if (closingA != -1) {
                   t = t.substring(0, closingA);                               if (t.indexOf('<a') < txt.length) {
                       return;
                   }
               }               
               
               linkHTML = linkHTML.replace(regEx, '<a href="">' + txt + '</a>');
               $(el).html(linkHTML);
           }           
       });
    }
              
    changeToLink ('p', 'hello');
    alert($('a').length);
});