This is a classic case of event delegation. Since you created the button dynamically using jquery, the click
event you've written won't fire. You have to handle as below using .on()
Use,
$(document).on('click', '.color', function() {
//Do something
});
Note: Using document
as the parent is bad in most cases & it affects performance because this event searches throught the whole document for the required class color
. So, replace document
with the closest parent which is always present in the DOM (static). May be in your case it is $('#box)
$('#box').on('click', '.color', function() {
//Do something
});