[jQuery] Problems with order in animation

[Max]

I have a menu with 3 items: Agradecimientos | Comentarios | Contacto
If I click one of these elements, a box may slide down, and show
content. And if the box is already down (if one of the  items is
active), the box should firts slide up, replace the content with the
new one, and slide down.
So, the order should be:

(if collapsed)
- Set the active state to the item selected
- Slide down the box (#textBox)
- Append new content in a div.content (display:none)
- Fade in content

(if shown)
*- Remove the active state to all items selected
- Set the active state to the item selected
* Fade out div.content
* Empty div.content
- Slide down the box (#textBox)
- Append new content in a div.content (display:none)
- Fade in content

So what's the problem?
The problem is that div.content fadeOut, empty, replace and fadeIn
BEFORE textBox slideUp and Down.
I tried callbacks, delays and a lot of "dirty" things without
success... anyone could help me?

Here is the code:

        $('#agradecimientos').click(function() {
                ($(this).children("a")).toggleActive();
                $('#textBox').slideDown();
                $('#textBox 
div.content').append("<h6>Agradecimientos</h6><p>Esto es
para decir gracias</p>");
                $('#textBox div.content').fadeIn('slow');
                return false;
        });

        $('#comentarios').click(function() {
                ($(this).children("a")).toggleActive();
                $('#textBox').slideDown();
                $('#textBox div.content').append("<h6>Comentarios</h6><p>Esto es
para comentar</p>");
                $('#textBox div.content').fadeIn('slow');
                return false;
        });

        $('#contacto').click(function() {
                ($(this).children("a")).toggleActive();
                $('#textBox').slideDown();
                $('#textBox div.content').append("<h6>Contacto</h6><p>Esto es 
para
contactarse</p>");
                $('#textBox div.content').fadeIn('slow');
                return false;
        });

        jQuery.fn.toggleActive = function(){
                $('#iconBox ul.bar li').children("a").removeClass("active");
                $(this).addClass("active");
                $('#textBox div.content').fadeOut();
                $('#textBox div.content').empty();
                $('#textBox').slideUp('');
        };


Thank's in advance