<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type ="text/css">
p {
display:inline;
border :1px solid #0094ff;
padding :2px 5px;
background-color :#fff;
margin:5px;
}
</style>
<script src="Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript" >
$(function () {
$("p").click(function () {
// $(this).css("backgroundColor", "red").siblings().css("backgroundColor", "#fff");
//end()方法：回到最近一次“破坏性”操作之前，将匹配的元素列表变为前一次的状态
//所谓 破坏性 的操作 是指调用一系列jq方法过程中，某个方法返回的jq对象内部的dom数组和前面方法返回的jq对象里的dom数组不一样的时候，那么这个方法，就叫做破坏性方法
$(this).css("backgroundColor", "red").prevAll().css("backgroundColor", "#red").end().nextAll().css("backgroundColor", "#fff");
$(this).siblings();//获取所有的兄弟节点
$(this).prevAll();//获取前面的兄弟节点
$(this).nextAll();//获取后面的兄弟节点
});
});
</script>
</head>
<body>
<p ></p>
<p ></p>
<p ></p>
<p ></p>
<p ></p>
<p ></p>
</body>
</html>
原文：http://www.cnblogs.com/sumg/p/3787735.html