index.html

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Não sei, só sei que foi assim.</title>
        <meta name="description" content="Se um dia eu ter que escolher entre chocolate branco e chocolate preto, escolherei o preto, vai que sou processado por racismo né?">
        <meta name="viewport" content="width=1000px">
    </head>
    <body>

    	<div id="menu">
    		
    	</div>

        <script src="js/vendor/jquery-1.8.0.min.js"></script>
        <script src="js/main.js"></script>

        <script>
// Algo que pode ser chamado de template
var template = {
    ul : {
        content : [{
          li : {
              content : {
                  a : {
                      attr : {
                          href   : 'http://tutsmais.com.br',
                          title  : 'TutsMais',
                          target : '_blank'
                      },
                      content  : 'TutsMais'
                  }
              }
          }
        },{
          li : {
              content : {
                  a : {
                      attr : {
                          href   : 'http://devcast.com.br',
                          title  : 'DevCast',
                          target : '_blank'
                      },
                      content  : 'DevCast'
                  }
              }
          }
        }]
    }
}

 // Hora do show!
    var html = HTJSON(template);

    $('#menu').html(html);
        </script>
    </body>
</html>