[jQuery] .ajax POST question, script stops.

Hello,
This is my first week programming in Javascript and more specifically,
jQuery.
I'm working on a nice little fun project to kinda get my hands dirty.
I have a page that has a variety of "roll over" divs, which are to
turn the color the users is select, if they dont click it *should*
turn it back to what the color of the div was before. (It doesnt, i
havent gotten that far YET!)
ANYWAY ---- My real question is that my script is suppose to be using
this .ajax functoin to send a POST request to another page. As you can
see from the code below, i'm clearly not doing it as it was intended.
I think this is causing all of my problems, because after the users
clicks the submit goes through, but then jQuery loses it's ability to
do any of the functions i created (also see below for the functions).
How can I get jQuery to use the new divs that are populated as a
result of an .ajax request.
<code>
    //Global Variable so both mouseover and mouseout can use the previous
color.
    var p_color = "";
    \$(".button").hover(function () {
        var color = \$("input#color_code").val();
        var p_color = \$(this).css("background-color");
        \$(this).css({ backgroundColor:color });
    }, function () {
    \$(this).css("background-color") == p_color;
    });
    \$(".button").click(function () {
        var color = \$("input#color_code").val();
        \$(this).css({ backgroundColor:color });
        color = color.substr(1);
        var id_select = \$(this).attr("id");
        id_select = id_select.substr(1);
        \$.ajax({
            type: "POST",
            url: "/creator.pl?colorselect=" + color + "idselect=" + id_select +
"",
            success: function(){ \$("#result").load("/creator.pl?colorselect="
+ color + "&id_select=" + id_select + "") }
        });
    });
</code>
Thank you for any help you can provide, i've been trying to fix it all
week.