Using a new class after applying append

How can I use the new class added via .append()?
Currently it looks like this, but when i click icon with remove-item class console.log doesn’t show “removed”.

$$(".add-item").on("click", function() {
    $$(".item-box").append(`<h2>Test</h2> <i class="icon f7-icons color-red remove-item">minus_circle</i>`);
});

$$(".remove-item").on("click", function() {
    console.log("removed");
});

I think you need to bind remove-item click event after append

1 Like

You have to bind the removal handler on the parent, and filter on .remove-item class. So it can catch click events from dynamically added elements. Something like:

$$(".item-box").on("click", ".remove-item", function() {
    console.log("removed");
});
3 Likes