I'm using simplescroll bar (SSB), which adds wrappers around my scroll content on page load. And I need to attach an event listener, which would work on scroll.
Without SSB a simple
document.querySelector(".element").parentNode.addEventListener('scroll', handler);
did work. But now it doesn't work, since the right .parentNode doesn't exist yet, it will be added later on by SSB in background (I don't know when, I don't know how and I have no control on it).
How do I attach scroll handler to dynamically created (not by me) element?
With a click event I do use a function like this
function addPostponedEventListener(selector, eventName, handler)
{
document.addEventListener(
eventName,
e =>
{
const el = e.target;
if (el.closest(selector))
{
handler();
}
}
)
}
addPostponedEventListener('.element', 'scroll', handler);
but it works only with bubbling, and bubbling seems to be disabled for scroll event, so it doesn't work.
Thanks to this answer I was able to do it:
function addPostponedEventListener(selector, eventName, handler)
{
let interval = setInterval(() =>
{
let el = document.querySelector(selector);
if (el)
{
el.addEventListener(eventName, handler);
clearInterval(interval);
}
}, 100);
}