title: Setting a jQuery event handler for AJAX-loaded data
body: <p>Being fairly new to jQuery and the AJAX basics, I've been trying to set up some fairly simple dynamic loading.</p>
  <p>I include a .js file setting up the <code>click</code> event handler, and it looks like this:</p>
  <pre><code>var baseurl = document.getElementById(&quot;baseurl&quot;).getAttribute(&quot;href&quot;);
  var pattern = new RegExp(&quot;[^/]+&quot;);
  var page = &quot;cnt/&quot; + pattern.exec(window.location.href.substr(baseurl.length)) + &quot;.php&quot;;
  
  $(document).ready(function(){
      $('a.ajax').bind('click',function(event){
          event.preventDefault();
          $('#content').load(&quot;cnt/&quot; + pattern.exec(this.href.substr(baseurl.length)) + &quot;.php&quot;)
      })
  });
  </code></pre>
  <p>Note that I do some changes to the file so the relative href &quot;testing/&quot; would turn into an absolute path to the file &quot;cnt/testing.php&quot;.</p>
  <p>My anchor tags look like this:</p>
  <pre><code>&lt;a href=&quot;testing/&quot; class=&quot;ajax&quot;&gt;Link to testing page&lt;/a&gt;
  </code></pre>
  <p>My problem is, that whenever new content is loaded into div#content the handler in my .js file is not registered for any links that may have appeared using AJAX.
  In other words the links will simply act as ordinary anchor-tags. I want it to load the next page using AJAX, just like it does with the first page.</p>