jquery 向DIV动态添加元素

1、通过jquery给元素动态添加样式运用addClass和removeClass即可。首先在html中准备jquery库文件，并且准备一个div元素，如下图所示。

2、然后在style标签里声明一个class样式，如下图所示。

3、接下来准备一个事件加载初始化的方法，在jquery中直接用匿名函数即可，如下图所示。

4、然后通过jquery的addClass方法给div元素添加一个class，如下图所示。

5、移除一个class的样式也很简单，如下图所示，通过removeClass即可。

实现思路：使用jQuery的length属性获取对象中元素的数目，$(selector).length。实例演示如下：

1、HTML结构：设置id为test的ul下有4个列表元素

<ul>

<li>Glen</li>

<li>Tane</li>

<li>John</li>

</ul>

2、jquery代码：点击列表后获取li数量

$(function(){

$("#test").click(function()

{

alert($("#test

li").length)

//

获取id为test的ul下的li元素的数量

})

})

假设dom结构为 <div id="div1"></div>

在其中添加p元素,并设置p元素的文本颜色为红色

var $div1 = $("#div1") //选择外层元素

var $p = $("<p id='pp'>123</p>") //设定需要添加的元素

$div1 & $div1.append($p) //把元素添加到外层元素中

$p.css('color', 'red') //修改新元素的属性

---