Remove the current row from table using jquery

Question

I want to remove the current row of the table by clicking the button using jquery i have tried this , please help me.

<script>
    $(document).ready(function () {
        $("#medbtn").click(function () {
            var medicinelist = $("#medList").val();
            var selecttype = $("#TypeList").val();
            var qtyInput = $("#qty").val();
            var text = $("#medList").text();
            var data = '<tr> <td>' + text + ' </td> <td>' + selecttype + '</td> <td>' + qtyInput + '</td> <td><input type="button" value="X" id="remove"/></td> <input type="hidden" value=' + medicinelist + '/> </tr>';
            $('#listMedicine').append(data);

   i have tried this here, but not remove the row please help me thanks
            $("#remove").click(function () {
                $('data').remove();
            })
        });


            });
</script>

how to do this , please guide me – SoftwareStudent Feb 01 '18 at 05:12 — SoftwareStudent, Feb 01 '18 at 05:12

score 0 · Answer 1 · answered Feb 01 '18 at 05:02

0

You should be doing:

$("#listMedicine").on("click", ".remove", function () {
   $('data').remove();
});

Because #remove is dynamically created and DOM would not attach the click handler to it.. Also use class .remove as id can not repeat.

answered Feb 01 '18 at 05:02

void

36,090
8
62
107

2

better close when there is dup – guradio Feb 01 '18 at 05:10

Remove the current row from table using jquery

1 Answers1