move items in a list box from one to the other in javascript

I have used  two list boxes on my form, one initially displays with items and the
other displays blank, by clicking a button, it is possible to move items
from one box to another using javascript.

<script>
function MoveItem(ctrlSource, ctrlTarget) {
var Source = document.getElementById(ctrlSource);
var Target = document.getElementById(ctrlTarget);

if ((Source != null) && (Target != null)) {
while ( Source.options.selectedIndex >= 0 ) {
var newOption = new Option(); // Create a new instance of ListItem
newOption.text = Source.options[Source.options.selectedIndex].text;
newOption.value = Source.options[Source.options.selectedIndex].value;

Target.options[Target.length] = newOption; //Append the item in Target
Source.remove(Source.options.selectedIndex); //Remove the item from Source
}
}
}
</script>

i called this function server side,

<table >
<tr>
<td>
<asp:ListBox id=”ListBox1″ runat=”server” Height=”111px” SelectionMode=”Multiple”>
<asp:ListItem Value=”1″>One</asp:ListItem>
<asp:ListItem Value=”2″>Two</asp:ListItem>
<asp:ListItem Value=”3″>Three</asp:ListItem>
</asp:ListBox>
</td>
<td>
<p>
<input onclick=”Javascript:MoveItem(’ListBox1′, ‘ListBox2′);” type=”button” value=”->” />
</p>
<p>
<input onclick=”Javascript:MoveItem(’ListBox2′, ‘ListBox1′);” type=”button” value=”<-” />
</p>
</td>
<td>
<asp:ListBox id=”ListBox2″ runat=”server” Height=”111px” SelectionMode=”Multiple”>
<asp:ListItem Value=”8″>Eight</asp:ListItem>
<asp:ListItem Value=”9″>Nine</asp:ListItem>
<asp:ListItem Value=”10″>Ten</asp:ListItem>
</asp:ListBox>
</td>
</tr>
</table>