How do I wait for the slideToggle to complete before executing code?

Question

I want to wait for the slideToggle effect to complete before executing the if statement and the fadeIn effect.

div_to_move = $(this).parents("div.kind_div");

div_to_move.slideToggle();
if ($(this).html() == "+") {
    $(this).html("-");
    $("div.kind_to", td).append(div_to_move);
} else {
    $(this).html("+")
    $("div.kind_from", td).append(div_to_move);
}
div_to_move.fadeIn();

How can I do?

Answer 1

You may add a callback to slideToggle :

var div_to_move = $(this).parents("div.kind_div");

div_to_move.slideToggle(400, function () {
    if ($(this).html() == "+") {
        $(this).html("-");
        $("div.kind_to", td).append(div_to_move);
    } else {
        $(this).html("+")
        $("div.kind_from", td).append(div_to_move);
    }
    div_to_move.fadeIn();
});