title: Link fails to work unless refreshing
body: <p>I am currently developping a mobile website using JQuery mobile. I am using multiple pages whitin my <code>foobar.html</code> to navigate as follow :</p>
  
  <pre><code>&lt;head&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; 
      &lt;link rel="stylesheet" href="style/jquery.mobile-1.3.1.css" /&gt;
      &lt;script src="jquery-js/jquery-1.10.1.js"&gt;&lt;/script&gt;
      &lt;script src="jquery-js/jquery.mobile-1.3.1.js"&gt;&lt;/script&gt;
      &lt;title&gt;Foobar&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div data-role="page" id="foo"&gt;
          &lt;div data-role="content"&gt;
              &lt;a href="#bar" data-role="button"&gt;Go to Bar&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div data-role="page" id="bar"&gt;
          &lt;div data-role="content"&gt;
              &lt;p&gt;Bar&lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I load the <code>foobar.html</code> file, click on <strong>Go to Bar</strong> and it works fine ; however, when I navigate from  <code>index.hmtl</code> to <code>foobar.html</code> and test it again, the link fails to work. Refreshing the page solves the problem. </p>
  
  <p>What would explain this behavior and how to fix it?</p>