I'm currently trying to make an extension for Firefox and Chrome where it converts any time in the page from 12hr to 24hr format. I have the code written but on the sites I've tested, it usually doesn't update anything, despite the console showing the times as having been. There have been a few instances where some nodes were updated, but not all of them and it isn't consistent.
"content_scripts": [
    {
        "matches": [
            "<all_urls>"
        ],
        "js": [
            "content_script.js"
        ],
        "run_at": "document_idle",
        "all_frames": true
    }
]
const tags = ['p', 'div', 'span', 
        'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 
        'strong', 'em', 'blockquote', 
        'li', 'td', 'dt', 'dd'];
const queryStr = tags.join(', ');
const nodes = document.querySelectorAll(queryStr);
setTimeout(() => {
        processNodes();
}, 2500)
const processNodes = () => nodes.forEach((node, i) => {
        if (node.innerHTML.match(/((1[0-2]|0?[1-9])(:|h)([0-5][0-9]) ?([AaPp][Mm]))/)) {
                console.log('==========');
                console.log('Before: ');
                console.log(node.innerHTML);
                node.innerHTML = node.innerHTML.replace(/((1[0-2]|0?[1-9])(:|h)([0-5][0-9]) ?([AaPp][Mm]))/, (match) => {
                        const phase = match.substring(match.length - 2, match.length).toUpperCase();
                        const hSeperator = match.includes('h');
                        match = match.replace(/[AaPp][mM]/, '');
                        const hmArray = match.split(/:|h/).map(str => Number(str));
                        const military = hmArray[0] + (phase === 'PM' && hmArray[0] < 12 ? 12 : 0);
                        return `${military < 10 ? '0' + military : military}${hSeperator ? 'h' : ':'}${hmArray[1] < 10 ? '0' + hmArray[1] : hmArray[1]}`
                })
                console.log('After: ');
                console.log(node.innerHTML);
                console.log('==========')
        }
});