Jquery .on click不会在DIV元素上切换CSS类

Question

我有一个通过Javascript创建的DIV元素的输出，看起来像这样。

<div class="span3">
    <div class="filter"><i class="icon-stop"></i>User 1</div>
</div>
<div class="span3">
    <div class="filter"><i class="icon-stop"></i>User 2</div>
</div>
<div class="span3">
    <div class="filter"><i class="icon-stop"></i>User 3</div>
</div>

以下是JS的片段我必须点击

切换课程

    $(".filter").on("click", function() {
        console.log("User is clicked");
        $(this).toggleClass("alert");
    });

有人可以向我指出为什么点击不会触发？并且该类未应用于单击的DIV元素？