Mustache template

by someprimetime

HTML

<script src="https://raw.github.com/janl/mustache.js/master/mustache.js"></script>
<script id="js-foo-template" type="text/x-bl-template">
   <div id="{{id_}}">
       type: "{{shape}}"
   </div>
</script>
    
<div id="container"></div>

CSS

#red_block {
    background: red;
    width: 20px;
    height: 20px;
    display: block;
}


#blue_block {
    background: blue;
    width: 20px;
    height: 20px;
    display: block;
}

JavaScript

var tmpl = $('#js-foo-template').html();
var params = {
    id_: 'red_block',
    shape: "block",
};

var output = Mustache.render(tmpl, params);

$('#container').append(output);


params.id_ = 'blue_block';
output = Mustache.render(tmpl, params);

$('#container').append(output);