Handlebars.jsの使い方 each

HTML

<h1>Handlebars.jsの使い方 each</h1>
<div id="output"></div>

template

<script id="input" type="text/x-handlebars-template">
<ul>
  {{#each people}}
  <li>{{id}} {{name}}</li>
  {{/each}}
</ul>
</script>

JavaScript

var values = {
    people: [
      {id: 1, name: "Ryu"},
      {id: 2, name: "Ken"},
      {id: 3, name: "Guile"}
    ]
};
function $(selector) {
  return document.querySelector(selector);
}
var template = Handlebars.compile($('#input').innerHTML);
$('#output').innerHTML = template(values);