I want to move the touch event that took place on the JavaScript element to another element.

Creating web applications for smartphones.
The screen is divided into a content area, a middle area, and a touch area.

I want to touch the touch area below to scroll and tap the top content area.

For touchstart, touchmove, touchend,

function dispatch(e){
    varevt= document.createEvent('Event')
    evt.initEvent(e.type, true, true)
    contentArea.dispatchEvent(evt)
}

I'm trying to create a new event and send a touch event as shown in , but it doesn't work. Specifically, touchstart, touchmove, touchmove that occurred in the touch area seem to be sent to an element in the content area.

I would appreciate it if you could let me know if anyone could tell me.