title: jquery mobile function running before the device ready
body: <p>I am building an android application using phonegap, and jQuery Mobile.</p>
  
  <p>From phonegap documentation, device ready function needs to be fired first before anything else.</p>
  
  <p>I have no idea why but </p>
  
  <pre><code>$(document).on("pageshow", "#keeperList", function(){ 
  listAllKeepers();
  });
  </code></pre>
  
  <p>is firing first.</p>
  
  <p>I cannot post whole code, since it is too much.</p>
  
  <pre><code> &lt;script type="text/javascript" src="js/cordova.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="js/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="js/jquery.mobile-1.3.1.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="js/db.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript"&gt;
  
   var db;
   document.addEventListener("deviceready", onDeviceReady, false);
  
   function onDeviceReady() {
   alert("PhoneGap is ready!");
   db = window.openDatabase("rentManag", "3.7.11", "Rent Manag", 100000000);
   db.transaction(createTable, errorCB, successCB);
   }
   $(document).on('pageshow', "#keeperList", function () { 
   listAllKeepers();
   });
   &lt;/script&gt;
  </code></pre>