JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head></head>
<body>
    <h1>
        <a href="http://bateru.com/news/2012/07/dot-js-tutorial">doT.js tutorial</a>
    </h1>
    <h2>Example 1</h2>
    <div id="example1"></div>
    
    <h2>Example 2</h2>
    <div id="example2"></div>
    
    <h2>Example 3</h2>
    <div id="example3"></div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dot/1.1.2/doT.min.js"></script>
</body>
</html>

JavaScript

(function(){
        // example 1
        var data = { name: "David" };                                 // step 1
        var template = "Hey <b>{{=it.name}}</b>, you own me money.";  // step 2
        var templateFunction = doT.template( template );              // step 3
        var html = templateFunction( data );                          // step 4
        document.getElementById("example1").innerHTML = html;
     }());
    // example 2
    (function(){
        var data = { thatThingOverThere: "Bartman" };
        var template = "Hey, look over there! It's {{=it.thatThingOverThere}}!";
        var tempFunc = doT.template(template);
        var html = tempFunc(data);
        document.getElementById("example2").innerHTML = html;
    }());
    
    // example 3
    (function(){
        var data = { team: "POWER RANGERS!"}
        var template = '{{ var chant = "Go go"; }}{{= chant + " " + it.team}}';
        var tempFunc = doT.template( template );
        var html = tempFunc( data );
        document.getElementById("example3").innerHTML = html;
    }());