CMS Load More - Infinite, newly loaded items GSAP interaction doesn't work

Attributes
11

hello team & @Support-Luis

this is the exact same issue and solution I’m looking for, however, I cannot make it work.

here’s my gsap code, could somebody please let me know what I should insert exactly in the site code? I have a load-more functionality with load under. read-only here

$(".faq_accordion").each(function () {
    let $accordion = $(this),
        $answer = $accordion.find(".faq_answer"),
        $plusIcon = $accordion.find(".faq_plus1");

    gsap.set($answer, { height: 0, overflow: "hidden" });
    gsap.set($accordion, { opacity: 0.25 }); // Default opacity

    let fullHeight = $answer[0].scrollHeight;

    let tl = gsap.timeline({ paused: true })
        .to($answer, { height: fullHeight, duration: 0.3, ease: "power2.out", onComplete: () => $answer.css("height", "auto") }) // Expand
        .to($accordion, { opacity: 1, duration: 0.3 }, 0) // Opacity to 1 when opening
        .to($plusIcon, { rotateZ: 90, duration: 0.3 }, 0)
        .reverse(); // Start in reversed state

    $accordion.on("click", function () {
        tl.reversed(!tl.reversed()); // Toggle play/reverse
    });
});

the code was written by AI, so it may be funny here and there. thank you for your help.