Must click twice to move table row Options

[Christian J]

CODE

<script type="text/javascript">
function move_up(current)
{
    // alert('click detected');

    var tr=current.parentNode;

    // first item can't move up higher, so it's moved down one step instead
    if(tr==tr.parentNode.rows[0])
    {
        tr.parentNode.insertBefore(tr, tr.nextSibling.nextSibling);
    }

    // other items are moved up one step
    else
    {
        tr.parentNode.insertBefore(tr, tr.previousSibling);
    }
}
</script>
<table border="1">
<tr><td onclick="move_up(this);">1------</td></tr>
<tr><td onclick="move_up(this);">2------</td></tr>
<tr><td onclick="move_up(this);">3------</td></tr>
</table>

Is something wrong with this script? It's meant to move the table rows, but in latest Firefox, Safari and Chrome I must click twice before anything moves (the function detects the first click, but nothing seems to happen). Subsequent clicks on the same row works, though. IE7 and Opera9 work as intended.

[Christian J]

Here's an alternate solution if someone else have the same problem:

CODE

function move_up(td)
{
    var row_index;
    var tr=td.parentNode;
    var tr_arr=tr.parentNode.rows;
    tr.custom_property='current';
    for(var i=0; i<tr_arr.length; i++)
    {
        if(tr_arr[i].custom_property=='current')
        {
            row_index=i;
            tr.custom_property='';
        }
    }

    // first row can't move higher, so it's cycled to the bottom instead
    if(tr==tr_arr[0])
    {
        tr.parentNode.appendChild(tr);
    }

    // any other row is moved (not cycled) up one step
    else
    {
        tr.parentNode.insertBefore(tr, tr_arr[row_index-1]);
    }
}
</script>
<table border="1">
<tr><td onclick="move_up(this);">1------</td></tr>
<tr><td onclick="move_up(this);">2------</td></tr>
<tr><td onclick="move_up(this);">3------</td></tr>
</table>