jQuery隐藏/显示复选框消息

我有一个复选框,当检查div弹出一条消息时,如果取消选中该复选框,则会弹出另一个带有另一条消息的div.我得到了这个工作得体,但当你连续几次点击复选框时,它会混淆并且消息无法正确显示.任何想法如何使这项工作更好？ (我是 jquery部门的noOb所以任何帮助都绝对值得赞赏).非常感谢！

Check it out!

HTML：

<input type="checkBox" name="chkWishList" id="chkWishList" />checkBox Label<br />
<div class="message1"><span>success<small></small></span></div>
<div class="message2"><span>Removed<small></small></span></div>

jQuery的：

$(function() {
    $(".message1").css("display","none");
    $(".message2").css("display","none");
    $("#chkWishList").click(function() {
        if (this.checked) {
            $(".message1").fadeIn("fast").fadeOut(4000);
            $(".message2").hide();
        }
        else {
            $(".message1").hide();
            $(".message2").fadeIn("fast").fadeOut(4000);
        }

    });
});

$(function() {
    $(".message1").css("display","none");
    $("#chkWishList").click(function() {
        if (this.checked) {
            $(".message1").stop(true,truE).fadeIn("fast").fadeOut(4000);
            $(".message2").hide();
        }
        else {
            $(".message1").stop(true,truE).hide();
            $(".message2").stop(true,truE).fadeIn("fast").fadeOut(4000);
        }

    });
});