jquery Learning record One: jquery dynamically adding HTML elements after setting their binding events

1. jquery dynamically adds HTML elements (for example:)

<div id= "Testdiv" >

<ul></ul>

</div>

Let's say we're going to add the <li> bind click event to the UL dynamically to produce the following results

<div id= "Devices_div" >

<ul>

<li name= "Apple" >apple</li>

<li name= "Pear" >pear</li>

</ul>

</div>

<script>

function test (name) {

Alert ("I ' M" +name);

}

2. Set the Click event using the On method

$ ("#devices_div ul"). Unbind (' click '). On ("Click", "Li", function () {
var Chooseitemstatus = $ (this). attr (' class ');
var deviceId = $ (this). attr ("DeviceId");

if (Chooseitemstatus = = "Chooselistitem") {
$ (this). attr (' class ', ' Chooselistitem choosed ');
Deviceids.push (DEVICEID);
} else {
$ (this). attr (' class ', ' Chooselistitem ');
Delete the selected element
for (var i = 0;i < Deviceids.length; i++) {
if (deviceids[i] = = deviceId) {
Deviceids.splice (i, 1);
Break
}
}
}
});

This article is from the "Sheep" blog, please make sure to keep this source http://5934497.blog.51cto.com/5924497/1676237

jquery Learning record One: jquery dynamically adding HTML elements after setting their binding events