title: ChangePage (jQuery Mobile) doesn't work
body: <p>this is the first page : index.html</p>
  
  <pre><code> &lt;!DOCTYPE html&gt;
   &lt;html&gt;
    &lt;head&gt;
    &lt;link rel="stylesheet" href="../test/style.css"&gt;
    &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css" /&gt;
   &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"&gt;              &lt;/script&gt;
   &lt;script type="text/javascript" src="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
   &lt;script&gt;
  
     $(document).ready(function(){
                $('#chercher').focus(function(){
            if ($('#chercher').val()=='(Code postale, Ville, Département ...)')
            $('#chercher').val("");
               });
  $('#chercher').blur(function(){
      if ($('#chercher').val()=='')
      $('#chercher').val("(Code postale, Ville, Département ...)");
  });     
  
  });
  
  
  $('#page').live('pagecreate',function(event){
  $("#login").bind("click", function(event) {
      $.mobile.changePage( "conexion.html", { transition: "flip"} );
  });
  });`
  
     &lt;/script&gt;
  
       &lt;body&gt;
           &lt;div data-role="page" id="page"&gt;
          &lt;div data-role="header" data-theme="a"&gt;&lt;h1&gt;Welcome&lt;/h1&gt;
  
       &lt;div data-role="navbar"&gt;
       &lt;ul&gt;
           &lt;li&gt;&lt;a href="#"&gt;Coupons&lt;/a&gt;&lt;/li&gt;
           &lt;li&gt;&lt;a href="#"&gt;Bon plan&lt;/a&gt;&lt;/li&gt;
           &lt;li&gt;&lt;input type="button" value="connect"  id="login" data-theme="a"/&gt;&lt;/li&gt;
  
       &lt;/ul&gt;
   &lt;/div&gt;&lt;!-- /navbar --&gt;
          &lt;/div&gt;
          &lt;div data-role="content" data-theme="c"&gt;
  
              &lt;div&gt;
                  &lt;input type="text" id="chercher" value="(Code postale, Ville, Département ...)"&gt;
              &lt;/div&gt;
              &lt;ul data-role="listview" data-inset="true"  data-dividertheme="b" data-count-theme="b"&gt;
                  &lt;li data-role="list-divider" &gt;Choisissez une des catégories&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/tout.png" class="ui-li-icon" alt="tout" width="30" height="25"&gt; &amp;nbsp;&amp;nbsp; Tout &lt;span class="ui-li-count"&gt;24&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/restauration.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt; &amp;nbsp;&amp;nbsp; Restauration&lt;/a&gt;&lt;span class="ui-li-count"&gt;2&lt;/span&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/loisir.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt;&amp;nbsp;&amp;nbsp; Loisirs&lt;/a&gt;&lt;span class="ui-li-count"&gt;156&lt;/span&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/beaute.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt;  &amp;nbsp;&amp;nbsp; Beauté,santé &lt;span class="ui-li-count"&gt;24&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/mode.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt;&amp;nbsp;&amp;nbsp;  Mode&lt;/a&gt;&lt;span class="ui-li-count"&gt;13&lt;/span&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/maison.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt;&amp;nbsp;&amp;nbsp; Maison, Jardin&lt;/a&gt;&lt;span class="ui-li-count"&gt;16&lt;/span&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/service.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt;&amp;nbsp;&amp;nbsp;  Services&lt;/a&gt;&lt;span class="ui-li-count"&gt;2&lt;/span&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="index.php"&gt;&lt;img src="images/nationnal.PNG" class="ui-li-icon" alt="tout" width="30" height="25"&gt;&amp;nbsp;&amp;nbsp; Nationnal&lt;/a&gt;&lt;span class="ui-li-count"&gt;0&lt;/span&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div data-role="footer" data-theme="a" class="ui-footer"&gt;&lt;h1&gt;Pied de page&lt;/h1&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div id="page2" data-role="page"&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My second page is named : conexion.html</p>
  
  <pre><code>  &lt;!DOCTYPE html&gt;
    &lt;html&gt;
   &lt;head&gt;
    &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css" /&gt;
   &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"&gt;   &lt;/script&gt;
    &lt;script type="text/javascript" src="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.js"&gt;&lt;/script&gt;
         &lt;body&gt;
                   &lt;script&gt;
                            function onSuccess(data, status)
                             {
                              data = $.trim(data);
                               $("#notification").text(data);
                              }
  
      function onError(data, status)
      {
         $("#notification").text(data);
      }  
      $(document).ready(function() {
          $("#submit").click(function(){
  
  
  
              var formData = $("#callAjaxForm").serialize();
  
              $.ajax({
                  type: "POST",
                  url: "conexion.php",
                  cache: false,
                  data: formData,
                  success: onSuccess,
                  error: onError
              });
  
              return false;
          });
      });
        &lt;/script&gt;
  
  &lt;!-- call ajax page --&gt;
  &lt;div data-role="page" id="callAjaxPage"&gt;
      &lt;div data-role="header"&gt;
          &lt;h1&gt;Connexion&lt;/h1&gt;
          &lt;a href="index.html" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home" data-url="/"&gt;Home&lt;/a&gt;
      &lt;/div&gt;
  
      &lt;div data-role="content"&gt;
          &lt;div data-role="collapsible" data-collapsed="false"&gt;
                  &lt;h3&gt;Sign in&lt;/h3&gt;
          &lt;form id="callAjaxForm"&gt;
              &lt;div data-role="fieldcontain"&gt;
                  &lt;label for="email"&gt;Email&lt;/label&gt;
                  &lt;input type="text" name="email" id="email"  /&gt;
  
                  &lt;label for="password"&gt;Password&lt;/label&gt;
                  &lt;input type="password" name="password" id="password"  /&gt;
                  &lt;h3 id="notification"&gt;&lt;/h3&gt;
                  &lt;button data-theme="b" id="submit" type="submit"&gt;Go&lt;/button&gt;
              &lt;/div&gt;
          &lt;/form&gt;
          &lt;div&gt;
              &lt;script src="http://connect.facebook.net/en_US/all.js"&gt;&lt;/script&gt;
    &lt;script&gt;
       FB.init({ 
          appId:'214039341980486', cookie:true, 
          status:true, xfbml:true 
       });
    &lt;/script&gt;
    &lt;fb:login-button&gt;Identifiez vous&lt;/fb:login-button&gt;
          &lt;/div&gt;
          &lt;/div&gt;
          &lt;div data-role="collapsible" data-collapsed="true"&gt;
              &lt;h3&gt;Create an account &lt;/h3&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div data-role="footer"&gt;
          &lt;h1&gt;Pied de page&lt;/h1&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>
  </p>