节点选取

<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $("li").click(function(){
        //DOM节点选取
        $(this).siblings();//兄弟
        $(this).addClass('active').siblings().removeClass('active');
        $(this).parent();//直接父元素
        $(this).parents();//祖先

        //DOM插入
        $(this).before('<li>(标签外)之前</li>');//在被选元素之前插入内容
        $(this).prepend('<b>开头</b>');//在被选元素的开头插入内容
        $(this).append('<b>结尾</b>');//在被选元素的结尾插入内容
        $(this).after('<li>(标签外)之后</li>');//在被选元素之后插入内容
    });

    $("#button").click(function(){
        //遍历
        $("ul li").each(function(){
            console.log($(this).text())
        });
        $("ul li").each(function(i,element){
            console.log($(this).text())
            console.log($(element).text());
            console.log(i);
        });
    });

});
</script>
<ul><li>111</li><li>222</li><li>333</li><li>444</li><li>555</li></ul>
<input type="button" id="button" value="遍历">