js对<ul>的操作问答，百分百结贴

Question

<table width="397" border="1">
<tr>
<td width="174" height="107">
<ul>
<li>记录1</li>
<li>记录2</li>
<li>记录3</li>
</ul>
  </td>
<td rowspan="3" width="48" align="center"><a href="" onclick="">>></a><br/><br/>
  <a href="" onclick=""><<</a></td>
<td width="153">

<ul>
<li>记录1</li>

</ul>
  </td>

</tr>
</table>
想通过点击链接实现选中的<li>可以在两边互相移动的效果，求个js函数(不用js框架)。谢谢，谢谢！

Answer 1

或者给个参考的页面链接，THX!

Answer 2

整个li移动过去。点击目标li -> 点击">>"   效果：左边的该li被清，同时右边加载出同名同值li

Answer 3

移到左边演示，是移动全部,选中效果无...
IE8/FF3.6下ok    <table width="397" border="1">
        <tr>
            <td width="174" height="107">
                <ul id="ulLeft">
                    <li>l记录1</li>
                    <li>l记录2</li>
                    <li>l记录3</li>
                </ul>
            </td>
            <td rowspan="3" width="48" align="center">
                <input type="button" onclick="" value=">>>" /><br />
                <br />
                <input type="button" onclick="MovetoLeft()" value="<<<" />
            </td>
            <td width="153">
                <ul id="ulRight">
                    <li>r记录1</li>
                    <li>r记录2</li>
                    <li>r记录3</li>
                    <li>r记录4</li>
                </ul>
            </td>
        </tr>
    </table>
        function MovetoLeft() {
            var left = document.getElementById("ulLeft");
            var right = document.getElementById("ulRight");
            var RightTotal = right.children.length;
            for (var i = 0; i < RightTotal; i++) {
                var moveItem = right.children[0];
                left.appendChild(moveItem);
            }
        }