将一个select中的内容移动到另一个select中

<div class="centent">
<select multiple id="select1" style="width:130px;height:180px;">
<option value="1">孙克杰</option>
<option value="2">朱信宗</option>
<option value="3">杨帆</option>
<option value="4">林非比</option>
<option value="5">亚历山大</option>
<option value="6">凌峰</option>
<option value="7">宋松</option>
<option value="8">王子瑜</option>
</select>
<div class="span1">
<span id="add">右移>></span><br/>
<span id="add_all">全部>></span>
</div>
</div>
<div class="centent">
<select multiple id="select2" style="width:130px;height:180px">

</select>
<div class="span2">
<span id="remove" style="width:500px">左移<<</span><br/>
<span id="remove_all">全部<<</span>
</div>
</div>

<style type="text/css">
span{
border:1px solid black;
background-color:#99FFFF;
cursor:pointer;
}
.centent{
width:200px;
float:left;
}
.span1{
position:absolute;
top:350px;
left:150px;
}
#add_all{
position:absolute;
top:30px;
}
.span2{
position:absolute;
top:410px;
left:150px;
}
#remove_all{
position:absolute;
top:30px;
}
</style>

<script>
$(function(){
$("#add").click(function(){
var $options = $("#select1 option:selected");//获取选中的选项
$options.appendTo("#select2");//追加到select2的select中
});
$("#add_all").click(function(){
var $options = $("#select1 option");
$options.appendTo("#select2");
});
//实现双击时，右移
$("#select1").dblclick(function(){
var $options = $("#select1 option:selected");
$options.appendTo("#select2");
});

$("#remove").click(function(){
var $options = $("#select2 option:selected");
$options.appendTo("#select1");
});
$("#remove_all").click(function(){
var $options = $("#select2 option");
$options.appendTo("#select1");
});
$("#select2").dblclick(function(){
var $options = $("#select2 option:selected");
$options.appendTo("#select1");
});
});
</script>