## 插入节点和删除节点
### 1.插入节点的方法
| 方法 | 描述 |
| --- | --- | --- |
| `append()` | 向每个元素内部追加内容 |
| `appendTo()` |将所有匹配的元素追加指定的元素中 |
| `prepend()` | 向每个匹配的元素内部前置内容 |
| `prependTo()` | 将所有匹配的元素前置到指定元素中 |
| `after()` | 在每个匹配的元素之后插入内容 | |
| `insertAfter()` | 将所有匹配的元素插入到指定元素的后面 |
|`before()`|在每个匹配的元素之前插入内容|
|`insertBefore()`|将所有匹配的元素插入到指定元素的前面|
~~~javascript
var $li_1 = $("<li title='香蕉'>香蕉</li>");
var $li_2 = $("<li title='雪梨'>雪梨</li>");
var $li_3 = $("<li title='其他'>其他</li>");
var $parent = $('ul');
$parent.append($li_1);
$parent.prepend($li_2);
var $two_li = $('ul li:eq(1)');
$li_3.insertAfter($two_li);
~~~
### 2.删除节点
jQuery提供了三种方法删除节点：remove(),detach(),empty()。
**1.remove()方法**
> ` remove()`方法的返回值是被删除节点的引用。
~~~
var $li = $('ul li:eq(1)').remove();//删掉第二个
$li.append('ul');
~~~
> remove()方法还可以通过传递参数来选择性的删除元素。
~~~javascript
$('ul li').remove('li[title!=菠萝]');
~~~
**2.detach()方法**
同样是从DOM中去掉所有匹配的元素，但不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。
~~~javascript
$('ul li').click(function(){
alert($(this).html());
});
var $li = $('ul li:eq(1)').detach();
$li.appendTo('ul');//绑定事件还在
~~~
**3.empty()方法**
严格来讲，empty()方法并不是删除节点，而是清空节点，它能清空元素中所有后代节点。
~~~javascript
var $li = $('ul').empty();
~~~
