jquery - Vertical aligning and fading out correctly, order of operations in jQuery?

Question

So I'm designing my portfolio and learning jQuery along the way. The problem I'm having is with the order of things, to get images to fade, align themselves, and fade back in nicely. If you go to my site: http://graysonearle.com/newtest/ and click on the first box "Frog Utopia" it should open up a little gallery. If you click on a thumbnail on the side, it swaps the image and posts a description. The problem is, you have to click on the first one twice to get it to go. In addition to this, if you switch between image sizes (some are long, some are fat) it holds the previous image's properties, so the description doesn't line up. Visit the site if you're willing to help and you'll see what I mean. Here is the relevant code:

$(document).ready(function() {
    // declare photo width variable
    var photo_width = 0;
    $('.chImg').click(function() {
        // get img src and chop it up       
        var srcv = $(this).attr('src');
        var sliced = srcv.slice(6);
        // return the base number of the image for correspdonding div
        // corresponding div is "d#"
        var divnum = sliced.substring(0, sliced.length - 4);
        // fade out active description div
        $(".activeDescript").each(function() {
            $(this).removeClass("activeDescript");
            $(this).fadeOut(110);
        });
        // change picture
        $("#chBox").fadeOut(110, function() {
            $("#chBox").html("<center><img src='" + sliced + "'/></center>");
        });
        // vertical align
        $("#chBox").vAlign();
        $('#chBox').waitForImages(function() {
            // wait for images before grabbing img width
            $("#chBox img").each(function() {
                photo_width = $(this).width();
                $(".description").width(photo_width);
                $("#d" + divnum).fadeIn(300);
                // make this descript active
                $("#d" + divnum).addClass("activeDescript");
            });
            $("#chBox").fadeIn(200);
        });
    });
});​

and vAlign.js:

    (function ($) {
    // VERTICALLY ALIGN FUNCTION
    $.fn.vAlign = function() {
        return this.each(function(i){
            var ah = $(this).height();
            var ph = $(this).parent().height();
            var mh = (ph - ah) / 2;
            $(this).css('margin-top', mh);
        });
    };
})(jQuery);