首页 | 新闻 | 交流 | 问吧 | 文档 | 手册 | 下载 | 博客

jquery随意添加移除html

作者:  时间: 2011-06-15

html代码:

<ul id="list3" class="eventlist">
<li>plain</li>
<li class="special">special <button>I am special</button></li>
<li>plain</li>
</ul>

script代码:

function addRemoveItemNS() {
var $newLi = $('<li class="special">special and new <button class="addone">I am new</button> <button class="removeme">remove me</button></li>');
$(
'#list3 li.special')
.find(
'button.addone')
.unbind(
'click.addit')
.bind(
'click.addit', function() {
$(
this).parent().after($newLi);
addRemoveItemNS();
})
.end()
.find(
'button.removeme')
.unbind(
'click.removeit')
.bind(
'click.removeit', function() {
$(
this).parent().remove();
});
}
$(document).ready(
function() {
addRemoveItemNS();
});
可以随意添加移除html代码。