javascript - 检测带有扩展JavaScript的动态下拉框上的点击

我正在尝试检测对Javascript中的列表元素的单击-但是有一个错误。该列表元素位于Quora中搜索栏的下拉菜单中。 www.quora.com-特别是，我想检测用户何时单击添加问题按钮并弹出弹出框。



弹出框包含一些额外的div，这些div是隐藏的或动态生成的。列表的html看起来像

<li class="addquestionitem" id="__w2_FWrLuSU_list_item_11">

当我将鼠标悬停在该特定列表元素上时，它变为

<li class="addquestionitem selected" id="__w2_FWrLuSU_list_item_11">

现在，我有如下代码：

$("li[class='addquestionitem selected']").click(function() {
    $(document).ready(function(){
        alert('this link has been clicked');
        $("div[id$=_publish_checkboxes]").append(element);
    }

但甚至没有显示警报。有什么建议么？

更新资料
以下发布的解决方案似乎都无效。我还使用了Quora主页上的create board按钮进行了测试，单击该按钮会产生类似的CSS嵌入弹出窗口。它在那里工作。具体来说，我使用的选择器是：

$("a[class='add_content_link action_button icon_action_button']")

真的不明白为什么用添加问题按钮在可比较的情况下不起作用

更新2
这是清单文件。 ：

{
    "name": "A browser action with a popup that changes the page color.",
    "version": "1.0",
    "manifest_version": 2,
    "browser_action": {
        "default_title": "Set this page's color.",
        "default_icon": "icon.png"
    },
    "permissions": [
        "tabs", "http://www.quora.com/*"
    ],
    "background": {
        "page": "popup.html"
    },
    "content_scripts":[
        {
            "matches": ["http://www.quora.com/*"],
            "js": ["jquery.js", "read_in_array.js", "add.js", "popup.js"]
        }
    ]
}

最佳答案

有什么建议么？


您将需要用$ .ready函数包装其他所有内容。另外，由于下拉列表可能是动态构建的，因此我建议使用delegated events。接下来，您的类选择器看起来很好奇，我想您也可以简单地省略selected类。

$(document).ready(function(){
    $(document).on("click", "li.addquestionitem", function() {
        alert('this link has been clicked');
        $("div[id$=_publish_checkboxes]").append(element);
    });
});