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 = '\
        \
            \
       \
        {{#products}}\
            <p>\
                <h1>{{name}}</h1>\
               <img src={{{imageURL}}}</img>\
                {{#url}}{{/url}}\
                {{#first}}<strong>{{/first}}\
                    {{{description}}}\
                {{#first}}</strong>{{/first}}\
                {{#url}}</a>{{/url}}\
            </p>\
        {{/products}}<br />\
       ';
  

    var json = {
        
  "products" : [
      {
    "space_gray" : {
      "imageURL" : "http://store.storeimages.cdn-apple.com/4079/as-images.apple.com/is/image/AppleInc/aos/published/images/2/01/2013/iphone5s/2013-iphone5s-gray?wid=300&hei=300&fmt=png-alpha&qlt=95&.v=1400750406674",
        "name" : "Finish",
          "description" : ""
    },
      "gold" : {
      "imageURL" : "http://store.storeimages.cdn-apple.com/4079/as-images.apple.com/is/image/AppleInc/aos/published/images/2/01/2013/iphone5s/2013-iphone5s-gold?wid=300&hei=300&fmt=png-alpha&qlt=95&.v=1400750406103",
        "name" : "Finish",
          "description" : ""
    },
      "silver" : {
      "imageURL" : "http://store.storeimages.cdn-apple.com/4079/as-images.apple.com/is/image/AppleInc/aos/published/images/2/01/2013/iphone5s/2013-iphone5s-silver?wid=300&hei=300&fmt=png-alpha&qlt=95&.v=1400750408761",
        "name" : "Finish",
          "description" : ""
    }
    
  ]
      }
};

            "bolder": function () {
            return function (text, render) {
                return "<strong>" + render(text) + '</strong>'
            }
        }
    };
    var html = Mustache.to_html(template, json);
    $('div#AOSUSStore').html(html);
});