Javascript 从HTML中输出的JS调用函数<；脚本>；标签

这是我的HTML：

<div id="test-div"></div>
<button class="a-button">Click</button>

但是，当我去掉HTML/脚本输出并将click事件放在父函数之外时，如下所示：

function parent() {

    alert("Parent");

    var output = "";

    output += "<p>Hello World</p>"
    //output += "<script>$('.a-button').click(function() { parent(); });</script>"

    $("#test-div").html(output);
}

parent();

$('.a-button').click(function() { 
    parent(); 
});

函数父函数（）{
警惕（“家长”）；
var输出=”；
输出+=“你好，世界
”
//输出+=“$（'.a-button'）。单击（函数（）{parent（）；}）；”
$（“#test div”）.html（输出）；
}
父项（）；
$（'.a-button'）。单击（函数（）{
父项（）；
});

一切正常

不幸的是，由于我需要能够从输出的脚本调用父函数，所以这将无法实现

---

我试图为这个问题设置一个Plunkr/JSFiddle，但它似乎都不支持jQuery.html（输出）。非常感谢您的帮助

这不是一个好方法，你能解释一下你为什么需要这样做吗？我打赌还有很多其他方法可以做到这一点。输出的JS使用for循环中定义的变量。事实上，这个脚本被输出了很多次，每次都与数据库相关的不同ID略有不同。我选择了.html（output）选项，除了这个明显的问题之外，它似乎对我来说还不错！“事实上，此脚本被输出了很多次，每次都会使用与数据库相关的不同ID略有不同”-如果需要运行相同的函数，每次只使用不同的数据，然后，您可能应该将该数据放在其他地方–例如，放在元素上的自定义数据属性中，当单击该元素时，该元素将调用该函数。一次又一次地输出基本相同的函数代码是毫无意义的。我将查看一下custom data属性，但现在这是我唯一能解决需要实现的问题的方法。对于我发布的问题的解决方案，我们将不胜感激。坦率地说，CBroe建议的是解决您问题的最简单方法。您可能会通过一些努力使您当前的方法发挥作用，但这可能需要比正确执行更长的时间。

Uncaught TypeError: parent is not a function

function parent() {

    alert("Parent");

    var output = "";

    output += "<p>Hello World</p>"
    //output += "<script>$('.a-button').click(function() { parent(); });</script>"

    $("#test-div").html(output);
}

parent();

$('.a-button').click(function() { 
    parent(); 
});