title: jQuery mobile - get the loaded page ID?
body: <p>I have a document called "info.html".</p>
  
  <p>it have 5 pages:</p>
  
  <ol>
  <li>food</li>
  <li>toys</li>
  <li>entertainment</li>
  <li>smartphones</li>
  <li>electronics</li>
  </ol>
  
  <p>I want that once a page loads, jquery send a request to the server for information about this item.</p>
  
  <p>I all need to know is how to trigger this function?</p>
  
  <p>Tried:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="ISO-8859-1"&gt;
          &lt;title&gt;CoCouppn!&lt;/title&gt;
          &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" /&gt;
          &lt;script src="http://code.jquery.com/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
          &lt;script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
              $(document).on("pageshow", function() {
                  alert($(this).attr('id'));
              });
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div data-role="page" class="pge" id="food"&gt;
              food
          &lt;/div&gt;
          &lt;div data-role="page" class="pge" id="toys"&gt;
              toys
          &lt;/div&gt;
          &lt;div data-role="page" class="pge" id="entertainment"&gt;
              entertainment
          &lt;/div&gt;
          &lt;div data-role="page" class="pge" id="smartphones"&gt;
              smartphones
          &lt;/div&gt;
          &lt;div data-role="page" clsas="pge" id="electronics"&gt;
              electronics
          &lt;/div&gt;
  
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>It alerts "undifined" instead of page ID.</p>
  
  <p>What is the problem?</p>