javascript - javascript函数中的自定义html

我正在尝试调用使用自定义HTML的javascript函数，如下所示。
如果从javascript函数中调用，则某种程度上不会被识别。如果在函数外部执行，则下面函数中的代码可以很好地工作。有什么帮助吗？
码：

<button class="button"
onclick="javascript:validate();">Submit</button>
<p id="h2"></p>
<script>
function validate()
{
strVar2 = "<ag-dashboard>";
strVar2 += "        <div class='col-md-6'>";
strVar2 += "            <ag-chart name='writepending'>";
strVar2 += "            <ag-option name='title.text' value='Activity for
Today' ></ag-option>";
strVar2 += "            </ag-chart>";
strVar2 += "      </div>";
strVar2 += "        <div class='col-md-6'>";
strVar2 += "            <ag-chart name='writepending'>";
strVar2 += "            <ag-option name='title.text' value='Activity for
Yesterday' ></ag-option>";
strVar2 += "            </ag-chart>";
strVar2 += "      </div>";
strVar2 += "</ag-dashboard>";

document.getElementById("h2").innerHTML = strVar2;
}
</script>

最佳答案

尝试：

<button class="button" onclick="validate()">Submit</button>