title: jQuery document ready after ajax request
body: <p>I'm having problems with updating elements that are not ready after an ajax request.</p>
  
  <p>If I run my <code>myFunction()</code> function on page load like so:</p>
  
  <pre><code>$(function() {
   myFunction();
  }
  </code></pre>
  
  <p>I have no problems at all. But if I then use something like</p>
  
  <pre><code>$.ajax({
        url: this.href,
        dataType: "script",
        complete: function(xhr, status) {
          myFunction();
        }
      });
  </code></pre>
  
  <p>which returns <code>$(".myElement").replaceWith("htmlHere")</code>. The elements are simply not ready when the complete event fires. If I set a delay in there it works fine again.</p>
  
  <p>Is there any other event that gets fired other than 'complete' when the DOM is ready?</p>
  
  <p>Update:</p>
  
  <p>Here's the actual code:</p>
  
  <pre><code>$(function() {
    $("a.remote").live("click", function(e) {    
      $.ajax({
        url: this.href,
        dataType: "script",
        success: function(xhr, status) {
                  myFunction();
              }
      });
  
      e.preventDefault();
      return false;
    });
  
    myFunction();
  });
  
  function myFunction() {
      // Modify the dom in here
  }
  </code></pre>
  
  <p>The missing ); was just a typo on my part.</p>
  
  <p>Ive tried using success now instead of complete and it doesn't appear to make any difference.</p>