title: jquery mobile multipage with javascript template, does not always "refresh"
body: <p>I have a multi-page jQuery mobile page.</p>
  
  <p>When I go from Page 1 to Page 2 I see my template that I dynamically create using handlebars.</p>
  
  <p>The template:</p>
  
  <pre><code>&lt;script id="history-template" type="text/x-handlebars-template"&gt;
          &lt;div data-role="collapsible" id="share_history" &gt;
         &lt;h3&gt;{{share_title}}&lt;/h3&gt;
         {{#each historyItem}}
            &lt;h2&gt;Shared with {{shared_with}}&lt;/h2&gt;
            {{#list people}}{{firstName}} {{lastName}}, {{role}}{{/list}}
        {{/each}}
      &lt;/div&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>The javascript:</p>
  
  <pre><code>var context = {
      share_title: "View Share History",
      historyItem:  [
              {
                  shared_with: "with a group",
                  people: [
                      {firstName: "Bob", lastName: "Wong", role: "Dad" },
                      {firstName: "Tina", lastName: "Turner", role: "Guardian" },
                      {firstName: "Modest", lastName: "Mouse", role: "Dad" }
                  ]
              },
              {
                  shared_with: "with 3 people",
                  people: [
                      {firstName: "Baily", lastName: "Wong", role: "Dad" },
                      {firstName: "Gina", lastName: "Turner", role: "Guardian" },
                      {firstName: "Modest", lastName: "Mouse", role: "Dad" }
                  ]
              }
          ]
  
  };
  
  var source   = $("#history-template").html();
  var template = Handlebars.compile(source);
  
  Handlebars.registerHelper('list', function(people, options) {
  var out = "&lt;ul class=&gt;";
  
  for(var i=0, l=people.length; i&lt;l; i++) {
  out = out + "&lt;li&gt;" + options.fn(people[i]) + "&lt;/li&gt;";
  }
  
  return out + "&lt;/ul&gt;";
  });
  
      var html    = template(context);
  
      $('#share').html(html);
  $.mobile.changePage('#add-edit');
  </code></pre>
  
  <p>When I go from Page 1 to Page 2 (in my multipage layout) it works (good). </p>
  
  <p><strong>But</strong> if I click the back button, and <strong>then</strong> go back to Page 2, I see my content...minus the additional markup jQuery mobile adds (i.e. I see content but not my jQuery mobile appearance/theme).</p>
  
  <p><strong>Edit</strong> </p>
  
  <p>For my example, I had to do the following:</p>
  
  <pre><code>$('#share').html(html).trigger( "create" );
  </code></pre>