Manually trigger a scroll event of DOM element?

Question

I have two independent web elements, if I scroll the content of one element, I also want the 2nd element scroll at same time. Here is an example: https://stackedit.io

I did the following code, but it is not working:

element.find('.fullscreen-mk-content-textarea').on('scroll', function(e){
    // first element will trigger this event, then manully trigger the 
    // the scroll of the 2nd element. It's my plan. 
    console.log(e); // works
    element.find('.right-side').trigger('scroll'); // doesn't work...
});

What shall I do?

Answer 1

Vanilla Javascript

var el = document.querySelector(".right-side");

el.dispatchEvent(new Event('scroll'));