jQuery, on click przy elementach tworzonych dynamicznie

Question

Witam. mam taki button:

<button type="button" class="btn user-delete">
                Usuń
            </button>

który należy do:

<ul class="user-list">

Chcę dodać takie zdarzenie:

$(".user-list").on("click",".btn",function(){
        $(this).parent().remove();
    })

i to działa, jednak chciałbym to rozszerzyć tylko do buttonów "btn user-delete".

Wcześniej używałem:

    $(".btn").on("click",function(){

        if($(this).hasClass("user-delete")){
        $(this).parent().remove();
       }
    })

jednak to nie działa w przypadku nowych buttonów, tworzonych dynamicznie już po załadowaniu strony.

Jak to rozwiązać?

$(".user-list").on("click",".btn",function()

Da się jakoś odnieść tutaj do ".btn", żeby móc sprawdzić jego atrybut hasClass("user-delete")? 

 

Answer 1

Da się jakoś odnieść tutaj do ".btn", żeby móc sprawdzić jego atrybut hasClass("user-delete")? 

Przecież jQuery przyjmuje selektory CSS, więc wystarczy go użyć – .btn.user-delete. 

Comments

Próbowałem tego wcześniej tylko ze spacją pomiędzy .btn a .user-delete i dlatego nie działało :D Teraz działa, dzięki

Answer 2

$(".user-list").on("click",".btn", ({target}) => {
   const $target = $(target)

    $target.parent().remove();
})

To u ciebie działa?

Answer 3

poczytaj o addEventListener()

Comments

A po co? Nie rozwiązuje to żadnego problemu + wprowadza niespójność.