任务描述
本关任务：用 jQuery 遍历 DOM 元素的兄弟元素。效果如下：
相关知识
为了完成本关任务，你需要掌握：1.siblings()，2.next() ， nextAll()3.prev() ，prevAll()。
基本的html结构如下（CSS已省略）：
<div class="container"><p>p元素</p><span>sapn元素</span><h3>h3元素</h3><ul>ul元素</ul><ol>ol元素</ol></div>
效果图如下：
siblings()
如何给span元素的所有兄弟元素设置背景色呢？ 这里用siblings()。代码如下：
$("span").siblings().css("background","orange")
效果如下：
从上面可以看出：siblings()方法会返回被选元素的所有兄弟元素
next()
如何给span元素的后一个兄弟元素设置背景色呢？ 这里用next()。代码如下：
$("span").next().css("background","orange")
效果如下：
从上面可以看出：next()方法会返回被选元素的后一个兄弟元素
nextAll()
如何给span元素后的所有兄弟元素设置背景色呢？ 这里用nextAll()。代码如下：
$("span").nextAll().css("background","orange")
效果如下：
从上面可以看出：next()方法会返回被选元素后的所有兄弟元素。
prev() 和 prevAll()
prev()和next()相对应，它返回的是被选元素的前一个兄弟元素。
prevAll()和nextAll()相对应，它返回的是被选元素前的所有兄弟元素。
编程要求
在右侧编辑器Begin至End之间填充代码，遍历class="item"元素的兄弟元素。要求如下：
这里只用siblings(), pre(), prevAll(), next()来实现下面效果；设置p元素的颜色为red；设置span元素的颜色为orange；设置ul元素的颜色为green；设置ol元素的颜色为cyan；
格式注意：
获取元素统一用类名获取；统一用双引号""表示字符串；
效果如下：
<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><script src="/jquery-3.3.1.min.js"></script><style>.container{width: 400px;margin: 20px auto;}.container *{display: block;border: 2px solid #000;padding: 5px;margin: 15px;}</style></head><body><div class="container"><p>p元素</p><span>sapn元素</span><h3 class="item">h3元素</h3><ul>ul元素</ul><ol>ol元素</ol></div><script>$(function(){$(".item").css("background","yellow");//------------ Begin --------------$(".item").siblings().css("background","cyan");$(".item").prevAll().css("background","red");$(".item").prev().css("background","orange");$(".item").next().css("background","green");//-------------- End ---------------})</script></body></html>
