表格中动态添加行中，如何实现删除当前行？
<script type="text/javascript"> function addRow() { //添加行 var root = document.getElementById("tbody") var allRows = root.getElementsByTagName('tr'); var allCells = allRows[0].getElementsByTagName('td'); var newRow = root.insertRow(); var newCell0 = newRow.insertCell(); var newCell1 = newRow.insertCell(); newCell0.innerHTML = allCells[0].innerHTML; newCell1.innerHTML = allCells[1].innerHTML; } function removeRow(r) { //删除行（这个删除的是第一个。如何改成删除当前选中的行） var root = r.parentNode; root.deleteRow(); } </script><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <script src="../jquery/jquery-1.7b2.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $(".AddRow").click(function () { var template = $("#Template"); $("#testTable tbody").append(template.clone(true).removeAttr("id").show(500)); }); $(".DeleteRow").click(function () { $(this).parents("table tr").remove(); }); }); </script></head><body> <table id="testTable" cellpadding="0" cellspacing="0" class="t1" width="100%"> <tr> <td> </td> <td> <img src="../image/new.gif" alt="新增" class="AddRow" /> </td> </tr> <!--模板行--> <tr id="Template" style="display: none"> <td align="right"> <div style="text-align: right"> 卡 号：</div> </td> <td> <input type="text" name="name" value="" /> <img src="../image/010.gif" alt="删除" class="DeleteRow" /> </td> </tr> </table></body></html>