.trigger('create') cannot create a listview

.trigger('create') cannot create a listview

Here are the codes I have to dynamically create and enhance a page. The similar pattern has been working for many other kinds, such as text field, button, grid-view, etc. But I found it cannot work with a listview.

  1.     $(document).bind("pagebeforechange", function route(e, data) {
  2.         ...
  3.         $content = $page.children(":jqmData(role=content)");
  4.         var markup = '<ul id="calendarList" data-role="listview"><li>HELLO</li></ul>';
  5.         $content.html(markup);
  6.         $page.trigger('create');
  7.         $.mobile.changePage($page);
  8.     });

I would always get an error message like,

  1.     Cannot read property 'jQuery16409763167318888009' of undefined

Through debugging using Chrome, I found it always fails on the line of $page.trigger('create');