文档的增删改

1. 添加/替换元素
* append(content)
向当前匹配的所有元素内部的最后插入指定内容
* prepend(content)
向当前匹配的所有元素内部的最前面插入指定内容
* before(content)
将指定内容插入到当前所有匹配元素的前面
* after(content)
将指定内容插入到当前所有匹配元素的后面替换节点
* replaceWith(content)
用指定内容替换所有匹配的标签删除节点
2. 删除元素
* empty()
删除所有匹配元素的子元素
* remove()
删除所有匹配的元素

需求:
1. 向id为ul1的ul下添加一个span(最后)
2. 向id为ul1的ul下添加一个span(最前)
3. 在id为ul1的ul下的li(title为hello)的前面添加span
4. 在id为ul1的ul下的li(title为hello)的后面添加span
5. 将在id为ul2的ul下的li(title为hello)全部替换为p
6. 移除id为ul2的ul下的所有li

html如下：

<ul id="ul1">
  <li>AAAAAli>

  <li title="hello">BBBBBli>
  <li class="box">CCCCCli>

  <li title="hello">DDDDDDli>
  <li title="two">EEEEEli>
  <li>FFFFFli>
ul>
<br>
<br>
<ul id="ul2">
  <li>aaali>
  <li title="hello">bbbli>
  <li class="box">cccli>
  <li title="hello">dddli>
  <li title="two">eeeli>
ul>

实现如下：

//1. 向id为ul1的ul下添加一个span(最后)
    var $ul1 = $("#ul1");
    $ul1.append("<span>这是append的追加span>");
    $("<span>这是appendTo的追加span>").appendTo("#ul1");
    // 2. 向id为ul1的ul下添加一个span(最前)
    $ul1.prepend("<span>这是append的前面span>")
    $("<span>这是appendTo的追加span>").prependTo("#ul1");
    // 3. 在id为ul1的ul下的li(title为hello)的前面添加span
    $("#ul1>li[title='hello']").before('<span>这是before的追加span>')
    $("#ul1>li").filter("[title='hello']").before('<span>这是before的追加span>');
    // 4. 在id为ul1的ul下的li(title为hello)的后面添加span
    $("#ul1>li").filter("[title='hello']").after('<span>这是after的追加span>');
    // 5. 将在id为ul2的ul下的li(title为hello)全部替换为p
    $("#ul1>li").filter("[title='hello']").replaceWith("<p>p>");
    // 6. 移除id为ul2的ul下的所有li
    $("#ul2>li").remove()