JQuery will click anywhere except specific divs and problems with dynamically added html

Question

I want some elements to be highlighted on this web page when you click on one of them, but if you click elsewhere on the page, all these elements will no longer be highlighted.

I performed this task as follows, and it works fine, except for one thing (described below):

$(document).click(function() {
    // Do stuff when clicking anywhere but on elements of class suggestion_box
    $(".suggestion_box").css('background-color', '#FFFFFF');
});
$(".suggestion_box").click(function() { 
    // means you clicked on an object belonging to class suggestion_box
    return false;
});

// the code for handling onclicks for each element
function clickSuggestion() {
    // remove all highlighting
    $(".suggestion_box").css('background-color', '#FFFFFF');
    // then highlight only a specific item
    $("div[name=" + arguments[0] + "]").css('background-color', '#CCFFCC');     
}

This way to force the selection of elements works fine until I add more html to the page without loading a new page. This is done using .append () and .prepend ()

, , , "" , . , , ///onclicks ect, , ( ).

, , , , , . , pageload?

, , , , , , -. , .

Answer 1

.live " , , ". :

$(".suggestion_box").live("click", function() { 
    // means you clicked on an object belonging to className
    return false;
});

. .delegate, .

Answer 2

.live() , , . , .delegate(), , ; , .

jQuery =)

( , , @karim79 ; P)