javascript - 2 つのハンドラが特定の順序で完了するようにする

Question

同じイベントに 2 つのハンドラーがアタッチされている場合、そのうちの 1 つが常に他のハンドラーの前に完了するようにする方法はありますか?

この例では、長い操作をシミュレートするためにタイムアウトを使用しています。しかし、私はこのようなものを持つことができます:

var change_label = function () {

    var option = $(".selected_option a").text();
    $("li:first span").text(option);

};    


$("#container").on("click", "li", function () {
    var self = $(this);
    var t = setTimeout(function () {
        $(".sel").children("li").removeClass("selected_option");

        self.addClass("selected_option");

    }, 1000);

});



$("#container").on("click", "li", function () {

    change_label();

});

クラスが最初のハンドラーによって適用されるまで、テキストが (2 番目のハンドラーによって) 変更されないことを確認しますか?

http://jsbin.com/ayihiv/1/edit