JQuery操作html实现<li>标签上移和下移效果

1.为了方便操作元素，先定义一个css样式如：

.optli{color:green;}

2.将ul绑定（注册）点击事件

$('#ulName').on('click','li',nodeContent);                  //li点击事件

var nodeContent=function(){
    $(this).addClass('optli').siblings().removeClass('optli');//将选中的颜色设置为.optli，其余为原来
};

3.绑定上移事件：
   var moveUp=function(){
    var index = $('#ulName').find('.optli');              //找到选中的li
    if(index.index() != 0){                            //只要【下标值】不是0，都可以上移
      index.prev().before(index);
    }
   }

4.绑定下移事件：
   var moveDown=function(){
    var index = $('#ulName').find('.optli');
     if(index.index() != length-1){                    //只要【下标值】不是最后一个都可以下移
      index.next().after(index);
    }
  }