javascript - HTMLリストの箇条書きにイベントを追加するにはどうすればよいですか？

Question

HTMLリストの箇条書きにイベントを追加するにはどうすればよいですか？出来ますか？

Answer 1

$('ul li').on( "click" , function(){
    // do stuff
});

Answer 2

使用できます

$(document).ready(function() {
  $("li").click(function(event){
    // do something
  });
}

Answer 3

クリックイベントまたはDOMSubtreeModifiedなどの他の何かを処理しますか？次に例を示します：http：//jsfiddle.net/quant/At7xd/

HTML：

<h1>Some simple events</h1>
<ul id="list">
    <li>Item 1</li>
    <li>Item 2</li>
</ul>
<button>Add Item</button>​

JavaScript：

jQuery(document).ready(function($) {
    $("#list").on("DOMSubtreeModified", function(e) {
        console.log("DOMSubtreeModified event", e);
        $("h1").toggleClass("crazy");
    });
    $("#list").on("click", "li", function(e) {
        console.log("Clicked on an li:", $(e.currentTarget).html(), e);
        e.stopPropagation();
    });
    $("button").on("click", function(e) {
        console.log("Clicked on button", e);            
        $("#list").append("<li>Item " + ($("#list > li").size() + 1) + "</li>");
    } );
});

</ p>