Dynamically Adding Elements and trying to use the selectors .click event jQuery

Question

I'm trying to dynamically add elements and have click listeners for them in JQuery. For whatever reason the removeGroup event does not get set off when I click on an elements 'remove' button. Any help would be great.

$('.removeGroup').click(function(event){
    alert();
});
               
cartPopper.click(function(event){
    $('#selectedGroupList').find('.selected').remove();
    for(group in selectedGroups)
    {
        var group_id = selectedGroups[group];
        var name = $('.' + group_id).text();
        $('#selectedGroupList')
            .append
            (
            '<li style="font-size:20px" class="selected ' + group_id + '">'
            + '<a href="javascript: void(0);" class="">'
            + '<button class="btn btn-danger removeGroup" type="button">'
            + 'Remove'
            + '<text class="groupValue" style="display: none;">'
            + group_id + '</text></button></a>'
            + name
            + '</li>'
            );
     }
     cartPop.show();
});

Atif · Accepted Answer · 2012-11-14 18:06:35Z

5

In laymans terms, the code which you have written only binds a click event to elements that already exist and doesnt bind it to newly created elements.

By using the event delegation model, you can make it bind to current and future elements. I think I'm really bad at explaining so please refer to delegate() and on for more information.

Replace

$('.removeGroup').click(function(event){
    alert();
});

With

$(document).on('click', '.removeGroup', function(event){
    alert();
});

answered Nov 14, 2012 at 18:06

Atif

10.9k22 gold badges68 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Dynamically Adding Elements and trying to use the selectors .click event jQuery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related