replace string in HTML doc after page loads

Ive a html doc with some markup like:

<p>Substance A, a metabolite enhances serotonergic production in neurons [33088927]. Substance B confers neuroprotection [28388366].  &nbsp;</p>

After the page loads Id like to find every occurrence in the document where there are square brackets and replace the string with something else, eg [33088927] -> 33088927i.

Using regex101.com Ive put together a function which finds the instances of square brackets:

function the_Pubs(){
    window.addEventListener("load", function(){
        const regex = /\[(.*?)\]/gm;
        let result;
            while((result = regex.exec(document.documentElement.outerHTML)) !== null) {
                if (result.index === regex.lastIndex) {
                        regex.lastIndex++;
                        }

        result.forEach((match, groupIndex) => {
        console.log(`Found match, group ${groupIndex}: ${match}`);
            
});
}
})}

How can I replace the found instances?