title: render a HTML template for Javascript
body: <p>HTML Code:</p>
  
  <pre><code>&lt;form id="add_post"&gt;
      &lt;div id="post-add-tag"&gt;
          &lt;div class="input-group"&gt;
              &lt;input type="text" id="post_tags" name="post_tags" /&gt;
              &lt;span class="input-group-btn"&gt;
                  &lt;button id="add_tag_button" type="submit"&gt;Add&lt;/button&gt;
              &lt;/span&gt;
          &lt;/div&gt;
          &lt;ul id="tags_list"&gt;&lt;/ul&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>PHP code that prints this scripts into footer:</p>
  
  <pre><code>function post_tag_template(){
      ?&gt;
      &lt;script type="text/template" id="the_template"&gt;
          &lt;li&gt;
              &lt;input type="hidden" name="items[]" value="{{= stripHTML(name) }}" /&gt;
              {{= stripHTML(name) }}
          &lt;/li&gt;
      &lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          function stripHTML(html)
          {
             var tmp = document.createElement("DIV");
             tmp.innerHTML = html;
             return tmp.textContent||tmp.innerText;
          }
      &lt;/script&gt;
      &lt;?php
  }
  </code></pre>
  
  <p>and this is the javascript code:</p>
  
  <pre><code>function addTag(tag) {
      var form        = $('form#add_post'),
          tags_list   = form.find('ul#tags_list'),
          source      = $('#the_template').html();    
  
      tags_list.append(source);
  }
  
  $(document).on('click', 'form#add_post #add_tag_button', function(e) {
      e.preventDefault();
  
      addTag( $('input#post_tags').val() );
  });
  </code></pre>
  
  <p>What are my codes do?</p>
  
  <p>My codes print the content of template <code>#the_template</code> without replace <code>#{{= stripHTML(name) }}</code> with the tag name (The value of input <code>#post_tags</code>).</p>
  
  <p>What do I need to do?</p>
  
  <p>I want when I click on <code>#add_tag_button</code> get the template content <code>#the_template</code> and replace <code>{{= stripHTML(name) }}</code> with the tag name (The value of input <code>#post_tags</code>).</p>