Javascript jquery更改附加元素的父html

请帮助调整代码：

$('parent').click(function(){
    $(this).html('<button> child <button/>');

    $('button').click(function(){
        $(this).parent().html('some new html');
    });
});

$（'parent'）。单击（函数（）{
$（this.html（'child'）；
$（“按钮”）。单击（函数（）{
$（this.parent（）.html（'somenewhtml'）；
});
});

---

我试图用jQuery创建动态动作构象。例如，用户单击删除（父项）。删除然后更改为是/否（子按钮）。用户单击“否”，父html将再次变为“删除”。

您可以尝试委托事件处理程序，如

$(document).on('click', '.delete', function () {
    $(this).replaceWith($('<span />', {
        html: '<button class="yes">Yes</button><button class="no">No</button>'
    }))
})
$(document).on('click', '.no', function () {
    $(this).parent().replaceWith($('<button />', {
        text: 'Delete',
        'class': 'delete'
    }))
})
$(document).on('click', '.yes', function () {
    console.log('delete')
})

$（文档）。在（'click'，'delete'，函数（）{
$（此）。替换为（$（''）{
html:“YesNo”
}))
})
$（文档）.on（'click'，'no'，函数（）{
$（this）.parent（）替换为（$（“”）{
文本：“删除”，
“类”：“删除”
}))
})
$（文档）.on（'单击'，'.yes'，函数（）{
console.log（'delete'）
})

---

演示：

您可以创建一个新的jQuery元素，然后将其追加，然后可以将单击处理程序仅分配给该元素

$（“#父项”）。单击（函数（）{
var yesBtn=$（“是”）；
var noBtn=$（'No'）；
$（this.html（“”）；
$（此）.append（yesBtn）；
$（this）.append（noBtn）；
$（yesBtn）。单击（函数（）{
event.stopPropagation（）；
//关于yes事件处理程序
$（this.parent（）.html（'您单击了Yes！'）；
});
$（noBtn）。单击（函数（）{
event.stopPropagation（）；
//在没有事件处理程序的情况下
$（this.parent（）.html（'您单击了否！'）；
});
});

---

不是

事件。stopPropagation（）父单击。
为什么不能使用JavaScript确认弹出框？这样，您根本不需要编辑DOM，生活变得更简单：）

使用jquery ui及其模态函数不是更容易吗？我想这就是你所要求的，而且已经优化了。因为我是一个完美主义者，在你刚才点击的地方弹出的构象对话框更酷：）那么我建议按照@WreithKassan所说的，使用JQuery UI的对话框功能：
$('#parent').click(function(){
    var yesBtn = $('<button type="button">Yes</button>');
    var noBtn = $('<button type="button">No</button>');        

    $(this).html('');
    $(this).append(yesBtn);
    $(this).append(noBtn);

    $(yesBtn).click(function(){
        event.stopPropagation();
        // On yes event handler
        $(this).parent().html('You clicked Yes!');
    });

    $(noBtn).click(function(){
        event.stopPropagation();
        // On no event handler
        $(this).parent().html('You clicked No!');
    });
});

    $('parent').click(function(){
       var blnDelete = confirm("Do you want to delete?");
       if (blnDelete) {
         // Delete
       } else {
         // Don't Delete
       }
    });