Still really new to coding in javascript and I’m not quite sure where I am messing up. I want the script to search for email addresses on a page and then highlight them according to if they are safe, dangerous, or unknown.

async function getSafeEmails() {
    const response = await fetch(chrome.runtime.getURL('safe_emails.json'));
    const data = await response.json();
    return data;
}

async function getDangerousEmails() {
    const response = await fetch(chrome.runtime.getURL('dangerous_emails.json'));
    const data = await response.json();
    return data;
}

async function highlightEmails() {
    const safeEmails = await getSafeEmails();
    const dangerousEmails = await getDangerousEmails();

    var emailRegex = /b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+.[A-Z|a-z]{2,}b/g;
    var emails = document.body.innerText.match(emailRegex);

    if (emails) {
        emails.forEach(function(email) {
            var emailElement = document.createElement('span');
            emailElement.textContent = email;
            emailElement.style.backgroundColor = safeEmails.includes(email) ? 'green' : dangerousEmails.includes(email) ? 'red' : 'yellow';
            emailElement.style.padding = '2px';
            emailElement.style.borderRadius = '4px';
            emailElement.style.marginRight = '5px';
            document.body.innerHTML = document.body.innerHTML.replace(email, emailElement.outerHTML);
        });
    }
}

highlightEmails();

As stated previously, I’m trying out this code and expecting these email addresses to be highlighted