Question

I have a dynamically generated div named time_holder which has a number of occurences depending on the amount of rows returned from a database.

When one of the divs is clicked I want the background to change colour and all the other time_holder divs to remain or change back to the original colour. I though a simple reset would have done the job but this does not seem to work :

$(document).on('click', '.time_holder', function(){
$('.time_holder').css('background-color', '#EODEF3');
$(this).css('background-color', '#ccc');
});

I was expecting the first line to reset all the timeholder divs to the original colour and then the second line to change the background of the clicked div.

Answer 1

addClass isn’t for adding attributes. Use .css(). Here’s the code, simplifying a bit event binding:

$('.time_holder').on('click', function() {
    $('.time_holder').css('background-color', 'red');
    $(this).css('background-color', 'blue');
});​