AOS template,JSON given to Mustache

by navindian

HTML

<script src="https://github.com/janl/mustache.js/raw/master/mustache.js"></script>
<div id="AOSUSStore"></div>

CSS

div {
    font:14px Arial;
    margin:50px 20px;
}

JavaScript

$(function () {

    var template = '<h1>{{header}}</h1>\
        {{#message}}\
            <p>{{message}}</p>\
        {{/message}}\
        {{#products}}\
            <li>\
                {{#url}}<a href="{{url}}">{{/url}}\
                {{#first}}<strong>{{/first}}\
                    {{{name}}}\
                {{#first}}</strong>{{/first}}\
                {{#url}}</a>{{/url}}\
            </li>\
        {{/products}}<br />\
       ';

    var json = {
        "header": "Apple Store",
            "message": "content",
            "products": [{
            "name": "Shop iMac",
                "url": "#Blue"
        }, {
            "name": "Shop iPhone",
                "url": "#Blue"
        }, {
            "name": "Shop iPad",
                "url": "#Blue"
        }, {
            "name": "Shop iPod",
                "url": "#Blue"
        }],
            "bolder": function () {
            return function (text, render) {
                return "<strong>" + render(text) + '</strong>'
            }
        }
    };

    var html = Mustache.to_html(template, json);



    $('div#AOSUSStore').html(html);


});