JQuery问答应用程序-突出显示无序列表条目和调用函数

我正在用JQuery、JQtouch和Phonegap创建一个测验应用程序。主屏幕在一个无序列表中显示一个问题，然后在第二个列表中显示5个可能的答案。该信息从sqlite数据库中提取，并动态创建页面

我希望用户能够单击答案ul中的一行，然后高亮显示该行，取消高亮显示无序（答案）列表中的任何其他条目，并调用函数。我已经浏览了大量的示例代码，但无法了解实现。我的页面包含一个div：

<div id="answer_template2"></div>

---

当单击静态li元素时，会弹出警报，但当我选择了任何动态创建的列表元素但不知道如何将它们放在一起时，则不会弹出警报。任何帮助都将受到感激！谢谢，Nick。

首先，jQuery事件仅绑定到执行选择器时找到的元素

有两种常见的解决方法：

使用或将事件绑定到文档（或其他容器），并让它们检查li中的目标

$("li").live('click', function() { alert("hi"); });

将处理程序重新绑定到新创建的内容：

// ouput database result into question_template id section of page
document.getElementById('question_template2').innerHTML = questionHTML;
document.getElementById('answer_template2').innerHTML = answerHTML;
$("#answer_template2 li, #question_template2 li").click( handler );

---

另外，正如旁注-

$（“#问题_模板2”）.html（问题html）

比直接将HTML注入innerHTML更安全。它将使jQuery有机会通过销毁innerHTML来解除绑定/清理正在删除的元素的内存。

是否每次刷新列表时都会绑定click事件？嗨，gnarf，感谢您花时间回答并提供了一些提示-我想我需要休息一下才能了解这些概念！Nisn't.live（）假设要处理新添加的元素？@yoavmatchulsky-是的，选项1或选项2都可以，但我通常选择选项2。。。

$("li").live('click', function() { alert("hi"); });

// ouput database result into question_template id section of page
document.getElementById('question_template2').innerHTML = questionHTML;
document.getElementById('answer_template2').innerHTML = answerHTML;
$("#answer_template2 li, #question_template2 li").click( handler );