jquery-mobile - 動的に追加されたコンテンツが jQuery Mobile でレンダリングされないのはなぜですか?

Question

jQuery Mobile + バックボーン + RequireJS を使用しています。ログインに成功したら、次のことを行います。

require(['app/view/main'], function(MainView) {
  var mainView = new MainView();
  $('body').html(mainView.render().el);
});

render() は次のようになります

render: function() {
  this.$el.html(this.template);
  return this;
}

そうすると、私のページは空白です。本文を調べると、本文内に次の HTML が表示されます。

<div data-role="page" id="main">
  <div data-role="header" data-position="inline">
      <h1>Accounts</h1>
  </div>
  <div data-role="content">
    hello
  </div>
</div>

また、render() 内でこれを実行しようとしました:

this.$el.html(this.template).trigger('create');

としても

this.$el.html(this.template).page();

しかし、ページはまだ空白です。理由はありますか？

HTML を body 内に配置してページをロードすると、通常の jQuery Mobile アプリのように問題なく表示されます。