jquery on לא עובד על אלמנט חדש

[ש.ב.ח.]

שלום וברכה
לפי מיטב זכרוני הקוד הבא אמור לעבוד גם על אלמנטים חדשים שנכנסים לדף לאחר טעינה, אמנם הוא לא עובד...

$('.like-btn').on('click', function(){
       const post_id = $(this).data('post-id');
       const url = $(this).data('admin-url');
        const elm = $(this);

       elm.html('<i class="fa fa-circle-o-notch fa-spin"></i>');

       $.ajax({
            type: "POST",
            url: url,
            data: 'post_id='+post_id+'&action=vlr_set_post_like',
            success: function (response) {
                const v = $(response).text();

                const newElm = $('<a class="like-btn" data-post-id="' + post_id + '" data-admin-url="' + url + '"><i class="fa fa-thumbs-up">' + v + '</i></a>')
                elm.replaceWith(newElm);
            }
        });

    });

שימו לב שלדף נכנס אלמנט חדש שהוא מכיל את אותו קלאסס, בעצם הוא היה אמור גם להיות לחיץ וכו', אבל בפועל זה לא קורה לאחר שהוא מתחלף

ל"ישאלו"... הכל תקין ויש url וגם post id וחוזרת תגובה....

[yossiz]

@ש-ב-ח אמר בjquery on לא עובד על אלמנט חדש:

לפי מיטב זכרוני

לפי מיטב סברתי זכרונך בוגד בך...
כלומר, אני לא רואה שום סברא שזה יעבוד על אלמנטים חדשים.

[yossiz]

@ש-ב-ח עכשיו קראתי את התיעוד ואני רואה שלמרות שסברתי היתה נכונה אבל בכל זאת זכרונך גם צודק...
יש ארגומנט נוסף שאפשר להביא לפונקציית ‎$.on שגורם לו לעבוד על אלמנטים חדשים.
אם הבנתי נכון, מדביקים את ה-handler לאלמנט אבא ושמים בארגומנט השני selector שגורם ש-jquery מפעיל את ה-handler רק אם האירוע קורה על אלמנט שתואם את ה-selector.

[ש.ב.ח.]

@yossiz אמר בjquery on לא עובד על אלמנט חדש:

אם הבנתי נכון, מדביקים את ה-handler לאלמנט אבא ושמים בארגומנט השני selector שגורם ש-jquery מפעיל את ה-handler רק אם האירוע קורה על אלמנט שתואם את ה-selector.

בהחלט, לא הספקתי אתמול להשיב כאן.
אכן על מנת שזה יעבוד על אלמנטים חדשים יש צורך לקיים את אירוע על אלמנט האב שקיים תמיד בדף ואליו לקשר את האירוע הלחיצה על הצאצא שפעמים שהוא חדש.

כך:

$('body').on('click', '.element-selector', function(){
 //********//
})

[dovid]

פעם היה את https://api.jquery.com/live/
כיום משתמשים כפי שאמרתם והורסים את כל ה"קסם"