jQuery Remove Dynamically Created Element Not Working

Question

Here is the code and the jsFiddle http://jsfiddle.net/yh3rynab/1/

      var i = 1;
       $('body').on('click', '#add_row', function () {
           if (i >4) {
               alert("No more");
               return;
           }
           $('#fg01_container').append('<div class="form-group" id="fg01_0' + i + '"></div>');
           $('#fg01_0' + i).html('<div class="col-md-2 col-md-offset-4">CONTENT</div>');
           i++;
       });

       $('body').on('click', '#delete_row', function() {
           if (i > 1) {

               $("#fg01_0" + (i - 1)).remove;
               i--;
           }
       });

The code adds fine but it doesn't remove the element that was just created. Please advise!

(I think) Most of people like to downvote without explain the reason. Don't worry about it, your question is valid and it is well constructed and formatted. — kosmos, May 12 '15 at 09:01

score 2 · Accepted Answer · answered May 04 '15 at 10:14

2

Remove is a function. call it like remove()

 $("#fg01_0" + (i - 1)).remove();

answered May 04 '15 at 10:14

SSA

5,433
4
36
50

Holy mother of God... annoying isn't the word to describe my mistake. Thank you! – pee2pee May 04 '15 at 10:15

score 1 · Answer 2 · answered May 04 '15 at 10:14

1

remove is method and not property in jquery. You should use .remove() instead of .remove

 $("#fg01_0" + (i - 1)).remove();

Working Demo

answered May 04 '15 at 10:14

Milind Anantwar

81,290
25
94
125

jQuery Remove Dynamically Created Element Not Working

2 Answers2