<div class="aa" data-id="father">
<ul class="bb" data-id="brother">brother</ul>
<ul class="bb" data-id="my home" id="me" style="border:1px solid #333">click me
<li class="cc" data-id="son">son</li>
<li class="cc" data-id="daughter">daughter</li>
</ul>
<ul class="bb" data-id="sister">sister</ul>
</div>
<script>
$("#me").click(function(){
alert($(this).data("id")); //自身
alert($(this).parent(".aa").data("id")); //父元素
alert($(this).parent().data("id")); //父元素，与上一句相同
alert($(this).children(".cc").data("id")); //第一个子元素
alert($(this).children().data("id")); //第一个子元素，与上一句相同
alert($(this).siblings(".bb").data("id")); //第一个同辈元素
alert($(this).siblings().data("id")); //第一个同辈元素，与上一句相同
alert($(this).siblings(".bb:last").data("id")); //最后一个同辈元素
})
</script>

父元素与子元素可多次连用，如$(this).parent().parent(".aa")，又或者$(this).parents(".aa")。

另外需要注意的是，IE对DOM的解释执行与Chrome、FF等不同，用siblings可能会出现问题，具体原因我也不清楚，我就遇上这种情况：IE下，用parent("").siblings("")取不到正确对象，而用parents("").find("")就可以。