Moving a div and changing it's text in jQuery

Question

I'm having a problem with moving a div and changing it's text while doing a fadeOut/fadeIn. I have tried numerous options, even with creating a new div but nothing seems to work. append/appendTo won't work and for the past 5h I'm completely stuck here. See the full fiddle at http://jsfiddle.net/2DgNX/10/

I'm also quite new to jQuery and might be enterpreting on how to solve this way too easily. Basicly, the text "Go to yellow" should move to yellow. Either with just moving the existing #normal-text or by using the .detach function and creating a new element. .detach would be the prefered solution as I will probably be calling the text in the future scenarios.

$("#normal-text").fadeOut(1000, function () {
    //APPEND TO YELLOW
    $("#hi").append($('#yellow'), function () {
        //FADEIN
        $("#text").text("Hi!").fadeIn(1000);
    });
});

Answer 1

I don't know what you want exactly but this might be the code to do it: http://jsfiddle.net/2DgNX/12/

I think you got the animate-syntax wrong. There is no

{
   duration: 700,
   queue: false
}

Its only 700 as secpnd argument.