JSFiddle - React, Tailwind, and code Playground

by Mel Milner

HTML

<script src="http://borismoore.github.com/jsrender/jsrender.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div id="output"></div>

<script id="template" type="text/x-jsrender">
    <ul>
        {{for people}}
            <li>{{:name}}likes to wear {{:shirtcolur}} shirts </li>
        {{/for}}
    </ul>
</script>

CSS

body{
    margin:15px;
}

JavaScript

var data = {
    people: [
        {
            name:"frank bough",
            shirtcolor:"red"
        },
            {
            name:"jim slade",
            shirtcolor:"blue"
        },

            {
            name:"frank jones",
            shirtcolor:"green"
        }
        
        ]    
};

$("#output").html($("#template").render(data));