JSFiddle - React, Tailwind, and code Playground

by Stepan Suvorov

HTML

<script src="http://github.com/janl/mustache.js/raw/master/mustache.js"></script>
<textarea id="output"></textarea>

JavaScript

var  data = {
        "header": "Colors",
        "items": [
            {"name": "red", "first": true, "url": "#Red"},
            {"name": "green", "link": true, "url": "#Green"},
            {"name": "blue", "link": true, "url": "#Blue"}
        ],
        "empty": false
    };

var template = '<h1>{{header}}</h1>{{#bug}}{{/bug}}{{#items}}{{#first}}<li><strong>{{name}}</strong></li>{{/first}}{{#link}}<li><a href="{{url}}">{{name}}</a></li>{{/link}}{{/items}}{{#empty}}<p>The list is empty.</p>{{/empty}}';


document.getElementById("output").value = Mustache.to_html(template, data);