How to tell jQuery: When load is ready, show this?

Question

This code:

$("#permalink a").click(function(id){
var id = this.getAttribute('href');
$("#newPostContent").load(id, function() {
 $("#removeTrigger").click(function() {
 $("#removeThis").hideToggle();
 $("#postSingle").hideToggle();
 });
});
   $("#postSingle").fadeToggle();
   return false;
});

Shows #postSingle before the load function finish its work. How can I adjust it?

Thanks

(a lot of questions today, thank you, everybody :)).

Answer 1

Have you tried wrapping that in a document ready block? Like:

$(document).ready(function() {
  $("#permalink a").click(function(id){
  var id = this.getAttribute('href');
  $("#newPostContent").load(id, function() {
   $("#removeTrigger").click(function() {
   $("#removeThis").hideToggle();
   $("#postSingle").hideToggle();
   });
  });
   $("#postSingle").fadeToggle();
   return false;
});
});

Answer 2

Put everything you want to happen after the load in the callback function:

$("#permalink a").click(function(id){
    var id = this.getAttribute('href');
    $("#newPostContent").load(id, function() {
        $("#removeTrigger").click(function() {
             $("#removeThis").hideToggle();
             $("#postSingle").hideToggle();
        });
        $("#postSingle").fadeToggle();
    });
    return false;
});