title: handlebars js returns template code along with compiled code
body: <p>I'm using handlebars js - version 4.0.5.</p>
  
  <p>This is my first hand with any templating engine. I'm using it along with jQuery. </p>
  
  <p>I have created a external template file, and load the template when required using jQuery <code>.load()</code> as follows -</p>
  
  <pre><code>$("#sidebar-lists").load("/assets/template.html #emp-dep-lists", function(){
     var theTemplateScript = $("#emp-dep-lists").html();
     var theTemplate = Handlebars.compile(theTemplateScript);
     var context = data;
     var theCompiledHtml = theTemplate(context);
     $('ul#sidebar-lists').append(theCompiledHtml);
  });
  </code></pre>
  
  <p>and this is my template code inside <strong>template.html</strong> --</p>
  
  <pre><code>&lt;span id="emp-dep-lists"&gt;
      {{#each associateList}}
          &lt;li&gt;
              &lt;a href="#"&gt;
                  {{#if image}}
                      &lt;img src="{{image}}" height="35" width="35"&gt;
                  {{else}}
                      &lt;img height="35" width="35" src="/assets/images/black-user-shape.svg"&gt;
                  {{/if}}
                  &lt;span class="title"&gt;{{name}}&lt;/span&gt;
              &lt;/a&gt;
          &lt;/li&gt;
      {{/each}}
  &lt;/span&gt;
  </code></pre>
  
  <p>I have created a <code>&lt;ul&gt;</code> on my page with a <code>&lt;li&gt;</code>. Now I'm trying to append more <code>&lt;li&gt;</code> into the same <code>&lt;ul&gt;</code>. Although everything goes smoother, but it replaces my first <code>&lt;li&gt;</code> and also it adds template code at first occurrence and then rendered <code>&lt;li&gt;</code>.</p>
  
  <p>It gives the following result:</p>
  
  <pre><code>&lt;ul id="sidebar-lists"&gt;
  &lt;span id="emp-dep-lists"&gt;
      {{#each associateList}}
          &amp;lt;li&amp;gt;
              &amp;lt;a href="#"&amp;gt;
                  {{#if image}}
                      &amp;lt;img src="{{image}}" height="35" width="35"&amp;gt;
                  {{else}}
                      &amp;lt;img height="35" width="35" src="/assets/images/black-user-shape.svg"&amp;gt;
                  {{/if}}
                  &amp;lt;span class="title"&amp;gt;{{name}}&amp;lt;/span&amp;gt;
              &amp;lt;/a&amp;gt;
          &amp;lt;/li&amp;gt;
      {{/each}}
  &lt;/span&gt;
  &lt;li&gt;
    &lt;a href="#"&gt;
      &lt;img height="35" width="35" src="http://localhost:8084/assets/empImg/spot_1241.jpeg"&gt;
        &lt;span class="title"&gt;John&lt;/span&gt;
    &lt;/a&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>