Parse html from JSON file

Question

I'm trying to get HTML tags to work in my json-file that i fetch via js.

So i want the return to somehow make the <strong> to work when render it on the page. How would i do that?

Sample of the json:

{
    "header_title": "<strong>test</strong>"
}

JS:

const newTranslations = await fetchTranslationsFor(
    newLocale,
);

async function fetchTranslationsFor(newLocale) {
    const response = await fetch('/lang/en.json');
    return await response.json();
}

To render it i do like so: pseudo.

element.innerText = json.myprop;

Answer 1

Change innerText to innerHTML. When you use the text method, it escapes the html characters. Innerhtml renders the exact html.

element.innerHTML = json.myprop;