Using jQuery UI sortable with HTML tables

I want to output some data from the database in a HTML table, and I want the user to be able to reorder table rows. To achieve this, I used jQuery UI sortable, thus:

<script>
    $(function() {
        $( "#sortable" ).sortable();
        $( "#sortable" ).disableSelection();
    });
    </script>
<?php 
 while($row = mysql_fetch_assoc($co_authors)) {
                    echo "<tr id='sortable'><td>{$row['author_email']}</td>
                         <td>{$row['coauthor_level']}</td>";
                         <td><button class='remove' id='remove' name='remove' email="<?php echo $row['author_email'] ?>"
                            paper="<?php echo $row['paper_id'] ?>">Remove</button></td>
                         </tr>";
                }
?>

The problem is that when I drag a table tr, only td are dragged. Also, and most importantly, only the first row is dragable: the effect is not applied to other rows. How can I solve this?