title: Jquery mobile: pageinit event not fired
body: <p>Can somebody out there help me out with this code  please? This might be something stupid to fix but I've been now stuck with this since hours!
  pageinit event doesn't fire. The only way to get it fired is to move the script inisde the body, just before the closing tag, but this weird structure I haven't found in any official documentation, and I suspect is wrong !
  I am testing on Samsung phone emulator (avd).</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;meta name="generator"
      content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" /&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" /&gt;
  
  
      &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /&gt;
      &lt;script src="http://code.jquery.com/jquery-1.8.2.min.js"&gt;&lt;/script&gt;
      &lt;script&gt;
         $( document ).delegate("#aboutPage", "pageinit", function () {
                  alert('ok');
              alert($('#homePage').text());
          });
  
  &lt;/script&gt;
      &lt;script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"&gt;&lt;/script&gt;
      &lt;title&gt;Test Mobile Application&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div data-role="popup" id="popupBasic"&gt;
        &lt;p&gt;-....&lt;/p&gt;
      &lt;/div&gt;
      &lt;!-- Begin Homepage --&gt;
      &lt;section id="homePage" data-role="page" data-theme="a"&gt;
        &lt;header data-role="header" data-position="fixed"&gt;
          &lt;h1&gt;Header&lt;/h1&gt;
        &lt;/header&gt;
        &lt;div class="content" data-role="content"&gt;
          &lt;p&gt;Homepage&lt;/p&gt;
          &lt;a onclick="javascript:alert($('#homePage').text());" data-role="button"&gt;aaaaa&lt;/a&gt;
          &lt;p&gt;
            &lt;a href="#aboutPage"&gt;Go to About Page&lt;/a&gt;
          &lt;/p&gt;
          &lt;a href="#popupBasic" data-rel="popup"&gt;Open Popup&lt;/a&gt;
        &lt;/div&gt;
        &lt;footer data-role="footer" data-position="fixed"&gt;
          &lt;h1&gt;Footer&lt;/h1&gt;
        &lt;/footer&gt;
      &lt;/section&gt;
      &lt;!-- End Homepage --&gt;
      &lt;!-- Begin About Page --&gt;
      &lt;section id="aboutPage" data-role="page" data-theme="b"&gt;
        &lt;header data-role="header" data-position="fixed"&gt;
          &lt;h1&gt;Header&lt;/h1&gt;
        &lt;/header&gt;
        &lt;div class="content" data-role="content"&gt;
          &lt;p&gt;This is About Page&lt;/p&gt;
          &lt;p&gt;
            &lt;a href="#portfolioPage"&gt;Go to Portfolio Page&lt;/a&gt;
          &lt;/p&gt;
        &lt;/div&gt;
        &lt;footer data-role="footer" data-position="fixed"&gt;
          &lt;h1&gt;Footer&lt;/h1&gt;
        &lt;/footer&gt;
      &lt;/section&gt;
      &lt;!-- End About page --&gt;
      &lt;!-- Begin Portfolio Page --&gt;
      &lt;section id="portfolioPage" data-role="page" data-theme="a"&gt;
        &lt;header data-role="header" data-position="fixed" data-theme="d"&gt;
          &lt;h1&gt;Header&lt;/h1&gt;
        &lt;/header&gt;
        &lt;div class="content" data-role="content" data-theme="c"&gt;
          &lt;p&gt;This is Portfolio Page&lt;/p&gt;
          &lt;p&gt;
            &lt;a href="#homePage"&gt;Go back to Homepage&lt;/a&gt;
          &lt;/p&gt;
        &lt;/div&gt;
        &lt;footer data-role="footer" data-position="fixed" data-theme="d"&gt;
          &lt;h1&gt;Footer&lt;/h1&gt;
        &lt;/footer&gt;
      &lt;/section&gt;
      &lt;!-- End Portfolio page --&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>