Q:

on click doesn't work for  element that has class added by jquery

I have a  element that when a check box is checked a class is added and removed from the  element.. Now when the checkbox is checked the class is added to  correctly, however, the  .on('click') handler for that  element with the class added to it is ignored. If I manually add the class to the  element then the .on('click') element is not ignored..
For instance..
When the checkbox is activated it adds the .delete class to the , however, when the  is clicked after the class was added through jquery..the below code is never executed. However, it will work if  the class was hard coded in
$('a.delete').on('click',function(e){
    e.preventDefault();
    console.log('delete clicked');

    });

Is it just not possible to put a on click event for a element with a class that is added through addClass()? I feel like this is a simple problem ..

A:

Adding and removing the class dynamically would require a delegated event handler, as the element doesn't have the delete class when the event handler is attached  :
$(document).on('click', 'a.delete', function(e){
    e.preventDefault();
    console.log('delete clicked');
});

replace document with the parent element.

