One variation on simple JS templating

sample-usage.js

var someData = { collection: [{description: 'foo'}] };

// render the template named 'Sample_template'
var html = Templater.renderTemplate('Sample', someData);

document.getElementById('output').innerHtml = html;

// Or just get the template as a string
var template = Templater.fromId('Sample')

// Which you could use to, say, render a collection
Templater.renderCollection(template, [])

template.html

<script type="text/ejs" id="Sample_template">
  <ol>
    <% collection.forEach(function (item) { %>
      <li><%= item.description %></li>
    <% }); %>
  </ol>
</script>

<div id="output"></div>

Templater.js

/*global document */
(function (ctx) {
  // Simple JavaScript Templating
  // John Resig - http://ejohn.org/ - MIT Licensed
  (function(){
    var cache = {};

    function tmpl(str, data){
      // Figure out if we're getting a template, or if we need to
      // load the template - and be sure to cache the result.
      var fn = !/\W/.test(str) ?
        cache[str] = cache[str] ||
          tmpl(document.getElementById(str).innerHTML) :

        // Generate a reusable function that will serve as a template
        // generator (and which will be cached).
        new Function("obj",
          "var p=[],print=function(){p.push.apply(p,arguments);};" +

          // Introduce the data as local variables using with(){}
          "with(obj){p.push('" +

          // Convert the template into pure JavaScript
          str.replace(/[\r\t\n]/g, " ")
            .replace(/'(?=[^%]*%>)/g,"\t")
            .split("'").join("\\'")
            .split("\t").join("'")
            .replace(/<%=(.+?)%>/g, "',$1,'")
            .split("<%").join("');")
            .split("%>").join("p.push('")
          + "');}return p.join('');");

      // Provide some basic currying to the user
      return data ? fn( data ) : fn;
    }

    function renderCollection (str, collection) {
      var rendered = '';
      for (var i = 0; i < collection.length; i++)
        rendered += tmpl(str, collection[i]);
      return rendered;
    }

    /**
        Render a template that is fetched from a DOM ID
        @param {string} id - DOM Id of the template
     */
    function renderTemplate (id, data) {
      return tmpl(fromId(id), data || {});
    }

    function fromId (id) {
      var templateId = (id || '').replace(/_template$/, '') + '_template';
      return document.getElementById(templateId).innerHTML;
    }

    ctx.Templater = {
      render: tmpl,
      renderCollection: renderCollection,
      renderTemplate: renderTemplate,
      fromId: fromId
    };

  })();
  
}(this));

In order to use more mustache-esque {{ instead of <? (thus making it erb-friendly), replace the str. block with

str
  .replace(/[\r\t\n]/g, " ")
  .split("{{").join("\t")
  .replace(/((^|\}\})[^\t]*)'/g, "$1\r")
  .replace(/\t=(.*?)\}\}/g, "',$1,'")
  .split("\t").join("');")
  .split("}}").join("p.push('")
  .split("\r").join("\\'")
+ "');}return p.join('');");