Javascript 用jQuery解析html代码

我正在我的网站上使用新的（mdl）。我还使用加载动态内容

现在，需要使用

upgradeElement

函数注册新创建的元素，以便mdl了解它们并将javascript应用于它们。在他们的网站上，他们有一些这样做：

<div id="container"/>
<script>
  var button = document.createElement('button');
  var textNode = document.createTextNode('Click Me!');
  button.appendChild(textNode);
  button.className = 'mdl-button mdl-js-button mdl-js-ripple-effect';
  componentHandler.upgradeElement(button);
  document.getElementById('container').appendChild(button);
</script>

filledTemplate

只是为了清楚地知道它可以包含哪些内容。我需要绑定所有输入、文本区域、滑块、收音机、复选框和按钮。在上面的示例中，您可以从mdl中看到一个简单的卡片布局，带有两个单选框和一个按钮

我试图让componentHandler首先升级button元素，但mdl返回

元素。getAttribute不是一个函数

，所以我想我只是给

.upgradeElement（）

赋予了错误的值

我做错了什么

---

下面是一个代码笔示例：

尝试

componentHandler.upgradeElement（这是“MaterialButton”）componentHandler.upgradeAllRegistered（）以更新所有元素

我将我的应用程序结构化为一个通用容器和一组视图，使用jQuery加载，并使用Hogan呈现。我在插入模板后调用了
componentHandler.upgradeDom（）
，它似乎工作正常

我想这可能会进一步优化，在更小的粒度上升级，但这种简单的方法在我的Phonegap应用程序中效果很好。
变量tmpl和content用于简化调试，否则代码可能会变得更紧凑

app.render = function(template, data, destination) {
  $.get(template, function(html) {
    var tmpl = Hogan.compile(html);
    var content = tmpl.render(data);
    $(destination).html(content);
    componentHandler.upgradeDom();
  });
};

告诉我你是如何将回调附加到我不理解的事件。。。上面的链接似乎工作得很好。。。内容将在单击时附加到正文。。。我遗漏了什么吗？问题是元素没有在mdl中正确注册。单选按钮没有样式，而且按钮没有波纹。从我的问题中看我的原始示例，看看它应该是什么样子。现在我不明白。。。更新了答案。。。这是代码，非常感谢！这么简单。。。对不起，如果我的问题有点不清楚！
app.render = function(template, data, destination) {
  $.get(template, function(html) {
    var tmpl = Hogan.compile(html);
    var content = tmpl.render(data);
    $(destination).html(content);
    componentHandler.upgradeDom();
  });
};