jquery 向DIV动态添加元素

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

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

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

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

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

jquery在元素前面插入东西可以使用before()函数。语法：$(selector).before(content)，content 必需。规定要插入的内容（可包含 HTML 标签）

延展阅读：

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（ 或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

jQuery的模块可以分为：入口模块、底层支持模块和功能模块。其核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。

如果您想在jQuery中的第五个元素后添加一个新元素，可以使用以下代码：

```javascript

// 假设您要在id为myList的列表中添加一个新项

$('#myList li:eq(4)').after('<li>New Item</li>')

```

这将选择id为“myList”的列表中的第五个（索引从0开始）`<li>` 元素，并在其之后插入一个新的 `<li>` 元素。

请注意，`:eq()` 选择器用于选择具有特定索引位置的元素。因此，在上面的示例中，`:eq(4)` 将选取第五个元素。另外，`.after()` 方法用于在指定元素之后插入内容。

希望这可以帮助您解决问题！

---