Javascript Ajax加载的内容更改了调用它的文档中的元素

我有一个关于jquery和ajax的问题

我有2个html文件和1个js

index.html

<h1><div id="parent_header">This is parent header</div></h1>

<button id="my_button">Click here to load child.html</button>

<div id="result"></div>

成功。现在我想要child.html中的child_按钮在index.html中更改父标题。如何实现ajax加载的内容改变文档中调用它的内容？（不使用iframe）

演示：（在JSFIDLE上不可能）

---

谢谢

将此添加到success函数

$（“#child_按钮”）。在（“单击”，函数（）{（“#parent_header”）。文本（“child changed this text”）；}或具有
$（文档）。在父项中的（“单击”、“子项”按钮），函数…
$(document).ready(function() {
$("#my_button").click(function() {
    $.ajax({
        url: "child.html",
        dataType: "html",
        success: function(result) {
            $("#result").html(result);
            $("#child_button").on("click",function() { $("#parent_header").html("just changed for horror!"); });
        }
    });
});
});

$(document).ready(function() {
$("#my_button").click(function() {
    $.ajax({
        url: "child.html",
        dataType: "html",
        success: function(result) {
            $("#result").html(result);
        }
    });
});
});

$(document).ready(function() {
$("#my_button").click(function() {
    $.ajax({
        url: "child.html",
        dataType: "html",
        success: function(result) {
            $("#result").html(result);
            $("#child_button").on("click",function() { $("#parent_header").html("just changed for horror!"); });
        }
    });
});
});