JSFiddle - React, Tailwind, and code Playground

HTML

<div id="holder">
Original Content
</div>

<p>
<button id="btn_1">Overwrite textContent</button>
<button id="btn_2">Append to textContent</button>
<button id="btn_3">Append to innerHTML</button>
<button id="btn_4">Append using jQuery</button>
</p>

JavaScript

document.getElementById("btn_1").addEventListener("click", function() {
    document.getElementById("holder").textContent = "Hello World";
}, false);

document.getElementById("btn_2").addEventListener("click", function() {
    document.getElementById("holder").textContent += " -  <b>hello</b>    Later, he said Hello World  - ";
}, false);

document.getElementById("btn_3").addEventListener("click", function() {
    document.getElementById("holder").innerHTML += "<p>Hello World</p>";
}, false);

document.getElementById("btn_4").addEventListener("click", function() {
    var code_to_insert = $("<p>Hello World</p>");
    $("#holder").append(code_to_insert);
}, false);