How can I correctly store a HTML template within a HTML page?

Depending on your IDE, you may or may not get HTML syntax highlighting within <script></script> blocks. I use a div block as you did, but add

#templates {display: none;}

to the CSS.

Using <script> tags works great for this:

<script id="tableTemplate" type="text/html">
  <table class="table">
    {{#name_list}}
    <tr><td> {{name}} </td></tr>
    {{/name_list}}
  </table>
</script>

It's actually a drop-in replacement, it will work with your var template = $('#tableTemplate').html();

I store them in a script tag, so they don't get rendered, like this:

<script id="abc-template" type="text/html">
    <h1>{{name}}</h1>
</script>

You can then reference them like this:

var template = $('#abc-template').html();
var html = Mustache.to_html(template, data);
$('#abc-div').html(html);