交换选择框值

Question

这里我有两个下拉选择框（可编辑选择框）和两个下拉菜单之间的一个交换图像。

这里我想交换两个下拉列表的值，当我点击交换按钮时。

我已经尝试但我没有得到它。

    <div style="float:left;width:66%;height:auto;margin-top:10px;margin-left: 251px;">
    <select name="origin" id="s1" class="editable-select" style="width:330px;height:40px;" onChange="document.getElementById('s2').focus()">
      <option value=""></option>
      <option value="Bangalore">Bangalore (BLR)</option>
        <option value="Chennai">Chennai (MAA)</option>
        <option value="Goa">Goa (GOI)</option>
        <option value="Hyderabad">Hyderabad (HYD)</option>
        <option value="Kolkata">Kolkata (CCU)</option>
        <option value="Mumbai">Mumbai (BOM)</option>
        <option value="New Delhi">New Delhi (DEL)</option>
        <option value="Pune">Pune (PNQ)</option>
        <option value=" ">---------------</option>

 </select>

 <a class="dc_button3 ico-refresh" href="#" id="swap" style="width: 0px !important;min-width: 0px !important;top: 10px;left: 2px;"><img src="images/1372764758_interact.png" style="margin-left: 97px;"/></a>

 <div style="float:right;width:auto;height:auto;">
 <select id="s2" class="editable-select" style="width:330px;height:40px;" name="destination" onChange="document.getElementById('fcc').focus()">
      <option value=""></option>
      <option value="Bangalore">Bangalore (BLR)</option>
        <option value="Chennai">Chennai (MAA)</option>
        <option value="Goa">Goa (GOI)</option>
        <option value="Hyderabad">Hyderabad (HYD)</option>
        <option value="Kolkata">Kolkata (CCU)</option>
        <option value="Mumbai">Mumbai (BOM)</option>
        <option value="New Delhi">New Delhi (DEL)</option>
        <option value="Pune">Pune (PNQ)</option>
        <option value=" ">---------------</option>

 </select>

 </div>
</div>


<link rel="stylesheet" href="css/chosen.css" type="text/css"/>
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/chosen.jquery.js" type="text/javascript"></script>
<script src="js/organictabs.jquery.js" type="text/javascript" ></script>
<script type="text/javascript">
        $(function() {
            $("#home_ten_tab").organicTabs();
            $("#home_five_tab").organicTabs();
            $("#home_three_tab").organicTabs();
            $("#video_tab").organicTabs();
            $(".editable-select").chosen({
                create_option: true,
                persistent_create_option: true
            });
        });
    </script>                         
<script>
$(document).ready(function() {
$('#swap').click(function () {
var v1 = $('#s1').val(),
v2 = $('#s2').val();
alert(v1);
$('#s1').val(v2);
$('#s2').val(v1);
}); 
});
</script>

编辑：当我点击交换按钮时，我想交换两个下拉菜单中的值和选中的内容。

请有人帮助我......

Here it is the demo link

由于