JSFiddle - React, Tailwind, and code Playground

HTML

<div class="test">
Hello this is a <span>foo</span> test and I hope that <span class="foo">this</span> word is in red.
</div>

Also here is Something Else that should link nicely.

CSS

.foo {
    color: red;
}

.wikilink {
    text-decoration:underline;
    border-bottom: 1px solid #000;
}

JavaScript

//your array
var words = [
    {
        word: 'foo',
        link: 'http://www.something.com'
    },
    {
        word: 'Something Else',
        link: 'http://www.something.com/else'
    }
];

$(function() {
    //iterate the array
    $.each(words,
        function() {
            var searchWord = this.word;
            var link = this.link;
            $('body:contains("' + searchWord + '")').each(function() {
                var newHtml = $(this).html().replace(searchWord, 
                    '<a class="wikilink" title="here is a link to Wikipedia" href="'+link+'">' + searchWord + '</a>');
                $(this).html(newHtml);
            });
        }
    );
});