title: Address State confusion
body: <p>I built a simple deep linking page using Jquery address and following this example:<br>
  <a href="http://www.asual.com/jquery/address/samples/state/" rel="nofollow">http://www.asual.com/jquery/address/samples/state/</a>  </p>
  
  <p>Now in this example, a HTML5 Browser (I use Chrome 10) shows the actual displayed source. I.e. <a href="http://www.asual.com/jquery/address/samples/state/portfolio" rel="nofollow">http://www.asual.com/jquery/address/samples/state/portfolio</a> shows <code>Portfolio content.</code> in the <code>content</code> div, even though that content was inserted via Jquery address/Ajax/<code>$('.content').html()</code>.  I rebuilt this example, but on my page the source is always the one of the initial page, before any Ajax was executed. This is the same behaviour as in a non HTML5 browser.<br>
  What am I doing wrong?<br>
  Thanks for hints,<br>
  thomas</p>
  
  <p>edit:</p>
  
  <p>Here's the demo code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt; 
  
          $.address.init(function() {
  
              // Initializes the plugin
              $('.nav a').address();
  
          }).change(function(event) {
  
              // Selects the proper navigation link
              $('.nav a').each(function() {
                  if ($(this).attr('href') == ($.address.state() + event.path)) {
                      $(this).addClass('selected').focus();
                  } else {
                      $(this).removeClass('selected');
                  }
              });
  
              // Handles response
              var handler = function(data) {
                  $('.content').html($('.content', data).html()).show();
                  $.address.title(/&gt;([^&lt;]*)&lt;\/title/.exec(data)[1]);
              };
  
              // Loads the page content and inserts it into the content area
              $.ajax({
                  url: $.address.state() + event.path,
                  error: function(XMLHttpRequest, textStatus, errorThrown) {
                      handler(XMLHttpRequest.responseText);
                  },
                  success: function(data, textStatus, XMLHttpRequest) {
                      handler(data);
                  }
              });
          });
  
          // Hides the tabs during initialization
          document.write('&lt;style type="text/css"&gt; .content { display: none; } &lt;/style&gt;');
  
      &lt;/script&gt;   
  </code></pre>
  
  <p>Mine's pretty much identical. I removed the link highlighting, changed the URLs to match my site and changed the Ajax call since I'm loading html. I wonder if there's "something more" to it (like the neccessary .htaccess which the documentation doesn't really speak about but which I found in the project's GitHub).</p>
  
  <p>Here's my code:</p>
  
  <pre><code>$.address.init(function(event) {
          $('#blogMenu a').address();
          $('#blogBottomMenu a').address();
          $('.linkleiste a').address();
  }).change(function(event) {
          var value = $.address.state().replace(/^\/$/, '') + event.value;
    value = value.replace(/^\/blog\//,'');
    value = value.replace(/_/,'');
          var teile = value.split('/');
          var name = '';
          var thema = '';
          if(teile[0]) name = teile[0];
          if(teile[1]) thema = teile[1];
          $('#blog').hide();
              if(!value.match(/ADFRAME/)) {
                  $(document).scrollTo('#aufmacher','fast');
                  $('#blogMenu').load('/snp/blog_menu.snp',{A_NAME:name,ETIKETT:thema,id:id});
                  $('#blog').load('/blog/article.snp',{A_NAME:name,ETIKETT:thema,id:id},function() {
                      $('#blog').show();
                  });
              }
              else {
                  $('#blog').fadeIn('fast');
              }
  
      });
  </code></pre>