jquery - parent() doesn't delete rows -


i'm writing jquery script add 3 elements table. far, haven't been able delete entire row using parent() function. explain i'm doing wrong?

$(function(){     $("#dvtable").hide();        $("#btngenerate").click(function(){         var ename = $("#ename").val();         var eid = $("#eid").val();         var desc = $("#desc").val();         var dvtable= $("#display");         $("#formcontainer").hide();         $("#dvtable").show();         var content = dvtable.children();             content.append('<tr>')             .append('<td>' + ename + '</td>')             .append('<td>' + eid + '</td>')             .append('<td>' + desc + '</td>')             .append('<td onclick="edit()">edit</td>')             .append('<td onclick="remove()">del</td>')             .append('</tr>');         });          $("#addentry").click(function(){             $("#ename").val("");             $("#eid").val("");             $("#desc").val("");             $("#formcontainer").show();             $("#dvtable").hide();         });      });      function edit(){         }     function remove(){             $(this).parent().remove();         } 

    <html> <head> <script src="http://code.jquery.com/jquery-1.10.2.js"></script>  <script>      $(document).ready(function(){         //$("#dvtable").hide();         $("#btngenerate").click(function () {             var ename = $("#ename").val();             var eid = $("#eid").val();             var desc = $("#desc").val();              sztr = "<tr><td>";             sztr = sztr + ename + "</td>";             sztr = sztr + "<td>" + eid + "</td>";             sztr = sztr + "<td>" + desc  + "</td>";             sztr = sztr + '<td onclick="edit(this)">edit</td>';             sztr = sztr + "'<td class='delete'>del</td>'";             sztr = sztr + "</tr>";             $('#display tbody').append(sztr);          });           $('#display').on('click', '.delete', function () {             $(this).parents('tr').remove();         });      });    </script> </head> <body>      name:<input type="text" id="ename" value="name"/><br />     id: <input type="text" id="eid" value="new_id"/><br />     des <input type="text" id="desc" value="description"/><br />      <input type="button" value="generate" id="btngenerate">      <div id="dvtable">     <table id="display">         <tbody></tbody>     </table>     </div> </body> </html> 

Comments

Popular posts from this blog

SVG stroke-linecap doesn't work for circles in Firefox? -

routes - Laravel 4 Wildcard Routing to Different Controllers -

cross browser - XSLT namespace-alias Not Working in Firefox or Chrome -