как сохранить элементы DOM и их события

Question

Здравствуйте, я создаю небольшой небольшой пользовательский html конструктор, такой как "wix", и я хочу сохранить историю, чтобы сделать (отменить и сделать)

Я записал свои 3 функции для кода

моя проблема в том, что когда я клонирую элементы, они не получают атрибуты и события

let designHistory = []
let designHistoryCurrentIndex = 1

function saveDesign(){
    let iframeDoc = document.querySelector("iframe").contentWindow.document
    let saveObj = {}
    saveObj.id = designHistory.length
    saveObj.design = iframeDoc.getElementById("design-zone").cloneNode(true)
    saveObj.tree = document.getElementById("dap-ul").cloneNode(true)
    console.log(saveObj)
    designHistory.push(saveObj)
    designHistoryCurrentIndex = saveObj.id
}
function designHistoryBack(){
    designHistoryCurrentIndex--
    if(designHistoryCurrentIndex < 0)
        designHistoryCurrentIndex = 0
    let obj = designHistory[designHistoryCurrentIndex]

    let iframeDoc = document.querySelector("iframe").contentWindow.document
    let designZone =  iframeDoc.getElementById("design-zone")
    let tree =  document.getElementById("dap-ul")

    designZone.parentNode.insertBefore(obj.design,designZone)
    designZone.remove()

    tree.parentNode.insertBefore(obj.tree,tree)
    tree.remove()
}
function designHistoryNext(){
    designHistoryCurrentIndex++
    if(designHistoryCurrentIndex > designHistory.length - 1)
        designHistoryCurrentIndex = designHistory.length - 1
    let obj = designHistory[designHistoryCurrentIndex]

    let iframeDoc = document.querySelector("iframe").contentWindow.document
    let designZone =  iframeDoc.getElementById("design-zone")
    let tree =  document.getElementById("dap-ul")

    designZone.parentNode.insertBefore(obj.design,designZone)
    designZone.remove()

    tree.parentNode.insertBefore(obj.tree,tree)
    tree.remove()
}