title: JQuery Mobile pageShow and pageCreate events not firing
body: <p>I have a JQuery Mobile app. On the first page of the app, I'm trying to set some field values on load if they've been previously set. In an attempt to do this, I currently have the following:</p>
  
  <h2> Index.html</h2>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"&gt;
      &lt;meta name="apple-mobile-web-app-capable" content="yes"&gt;
  
      &lt;link rel="stylesheet" href="/resources/css/themes/mobile/core.css" /&gt;
      &lt;link rel="stylesheet" href="/resources/css/themes/mobile/app.css" /&gt;
  
      &lt;script type="text/javascript" src="/resources/scripts/jquery-1.9.1.min.js"&gt;&lt;/script&gt;  
      &lt;script type="text/javascript" src="/resources/scripts/app.ui-1.0.js"&gt;&lt;/script&gt;     
      &lt;script type="text/javascript" src="/resources/scripts/jquery.mobile-1.3.0.min.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="loginPage" data-role="page"&gt;
        &lt;div data-role="header" data-position="fixed"&gt;&lt;h1&gt;AppName&lt;/h1&gt;&lt;/div&gt;
        &lt;div data-role="content"&gt;
          &lt;label for="usernameTextBox"&gt;Username&lt;/label&gt;
          &lt;input id="usernameTextBox" type="text" autocomplete="false" /&gt;&lt;br /&gt;
  
          &lt;label for="passwordTextBox"&gt;Password&lt;/label&gt;
          &lt;input id="passwordTextBox" type="password" /&gt;&lt;br /&gt;
  
          &lt;div class="ui-grid-a"&gt;&lt;div class="ui-block-a"&gt;
            &lt;a href="#" id="loginButton" data-role="button" class="dd-btn-a" onclick="return loginButton_Click();"&gt;Login&lt;/a&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <h2>app.ui.js</h2>
  
  <pre><code>$("#loginPage").on("pagecreate", function () {
      alert("here 1");
      $.mobile.hidePageLoadingMsg();
  });
  
  $("#loginPage").on("pageshow", function () {
      alert("here 2");
      $.mobile.hidePageLoadingMsg();
  
      var us = false;
      var ps = false;
  
      var u = window.localStorage.getItem("username");
      if ((u != null) &amp;&amp; (u != undefined) &amp;&amp; (u.length &gt; 0)) {
          if (u != "undefined") {
              $("#usernameTextBox").val(u);
              us = true;
          }
      }
      alert(u);
  
      var p = window.localStorage.getItem("password");
      if ((p != null) &amp;&amp; (p != undefined) &amp;&amp; (p.length &gt; 0)) {
          if (p != "undefined") {
              $("#passwordTextBox").val(p);
              ps = true;
          }
      }
  
      if ((us == true) &amp;&amp; (ps == true)) {
          loginButton_Click();
      }
  });
  </code></pre>
  
  <p>Oddly, none of my "alert" boxes are fired. In addition, I do not see any errors in the console window. What am I doing wrong?</p>