jongpak/underscore_template.html

## underscore_template.html
<!DOCTYPE html>
<html>
<head>
<script src="//underscorejs.org/underscore-min.js"></script>
<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
<meta charset=utf-8 />
<title>underscore.js template</title>
</head>
<body>
    <h1>Underscore.js template example</h1>
    <div id="content"></div>

    <script type="text/template" id="itemTemplate">
        <h2><%= title %></h2>
        <ul>
        <%for(var i = 0; i < items.length; i++) { %>
            <li><%= items[i].name %></li>
        <%} %>
        </ul>
    </script>


    <script>
        var itemTemplate = $('#itemTemplate').html();
        var items = [
            { name: "test1"},
            { name: "test2"},
            { name: "test3"}
        ];

        var complied = _.template( itemTemplate );

        var template = complied({ title: 'todo', items: items });

        $('#content').html( template );
    </script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<script src="//underscorejs.org/underscore-min.js"></script>
	<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
	<meta charset=utf-8 />
	<title>underscore.js template</title>
	</head>
	<body>
	<h1>Underscore.js template example</h1>
	<div id="content"></div>

	<script type="text/template" id="itemTemplate">
	<h2><%= title %></h2>
	<ul>
	<%for(var i = 0; i < items.length; i++) { %>
	<li><%= items[i].name %></li>
	<%} %>
	</ul>
	</script>


	<script>
	var itemTemplate = $('#itemTemplate').html();
	var items = [
	{ name: "test1"},
	{ name: "test2"},
	{ name: "test3"}
	];

	var complied = _.template( itemTemplate );

	var template = complied({ title: 'todo', items: items });

	$('#content').html( template );
	</script>
	</body>
	</html>