JSFiddle - React, Tailwind, and code Playground

HTML

<div id="output"></div>

JavaScript

//stringbuilder
function StringBuilder(e){this.strings=new Array("");this.append(e)}StringBuilder.prototype.append=function(e){if(e){this.strings.push(e)}};StringBuilder.prototype.clear=function(){this.strings.length=1};StringBuilder.prototype.toString=function(){return this.strings.join("")}

var data = {
    fname: "Joe",
    lname: "Doe",
    occupation: "Developer",
    things: ["some", "list", "of", "things"]
}

var sb = new StringBuilder();

sb.append("<h1>" + data.fname + " " + data.lname + "</h1>");
sb.append("<p>Occupation: " + data.occupation + "</p>");
sb.append("<h3>A list of things</h3>");
sb.append("<ul>");
for (var i = 0; i < data.things.length; i++) {
    sb.append("<li>" + data.things[i] + "</li>");
}
sb.append("</ul>");

$("#output").html(sb.toString());