JSFiddle - React, Tailwind, and code Playground

by Ian Roberts

HTML

<div class="div1">
<p>Hello World this word tag should have a : charater after it, let's see what happens if the p contains more of the same word, tag TAG TaG tAG tag tag tag</p>
</div>
<br>
<div class="div2">
    <p>another p with tag in the text and there should be no : character after</p>
</div>
<br>
<div class="div1">
<p>let's see what happens if the div and p structure is repeated later in the DOM. This tag should have a : charater after it, again, let's see what happens if the p contains more of the same word, tag TAG TaG tAG tag tag tag, oh good, will work on repeated elements of the DOM structure & only works on the first word of the structures</p>
</div>

JavaScript

//add character after specifc word only works on first word

 $('.div1>p:contains(tag)').each(function(){
  $(this).html(
    $(this).html().replace('tag','tag:')
  );
});