title: Remember ajax added data when hitting back button
body: <p>I have a search page where every search result is added to the page with AJAX. This way I can let users search for e.g <em>Led Zeppelin</em>, then do another search for <em>Metallica</em> but add it to the same result list as the previous search.  </p>
  
  <p>My problem is when a user clicks on a link to a record, then hits the back button, back to the search result.<br>
  <strong>FireFox (7)</strong> keeps the page as it looked when I left it, displaying the full result.<br>
  <strong>IE (7,8)</strong> and <strong>Chrome (15)</strong> on the other hand will display the page as it were before adding any search results with AJAX, as if it doesn't remember that I added data to it.  </p>
  
  <p>Below is the code I use. I tried to add the <code>location.hash = "test";</code> but it didn't seem to work.</p>
  
  <pre><code>// Add search result
  $("#searchForm").submit(function (event) {
      //location.hash = "test";
      event.preventDefault();
  
      $.post($(this).attr('action'), $(this).serialize(),
      function (data) {
          $("tbody").append(data);
      });
  });  
  </code></pre>
  
  <p>I don't need a back button that keeps track of changes on the search page, like stepping through each different search result as it was added. I just want the browser to remember the last search result when I hit the back button.  </p>
  
  <p><strong>SOLVED</strong><br>
  Changing to <code>document.location.hash = "latest search"</code> didn't change anything.  I had to use the <code>localStorage</code> as Amir pointed out.</p>
  
  <p>This goes into the rest of the jQuery code:      </p>
  
  <pre><code>// Replace the search result table on load.
  if (('localStorage' in window) &amp;&amp; window['localStorage'] !== null) {
      if ('myTable' in localStorage &amp;&amp; window.location.hash) {
          $("#myTable").html(localStorage.getItem('myTable'));
      }
  }
  
  // Save the search result table when leaving the page.
  $(window).unload(function () {
      if (('localStorage' in window) &amp;&amp; window['localStorage'] !== null) {
          var form = $("#myTable").html();
          localStorage.setItem('myTable', form);
      }
  });
  </code></pre>