Step 4 - removing items I have added


#1

I can remove the items pre-added by the project prior to starting. However, any new items that I add I cannot remove after adding. So for example, the pre-populated

values of "Brie", "Bread", and "Figs" are removed when I click the .glyphicon-remove. But when I add the items "test" or "checkifworking", those items will not remove.

var template = function(text) {
  return '<p><input type="checkbox"><i class="glyphicon glyphicon-star"></i><span>' + text + '</span><i class="glyphicon glyphicon-remove"></i></p>';
};

var main = function() {
  $('form').submit(function() {
    var text = $('#todo').val();
    var html = $(template(text));
    $('.list').append(html);
    $('#todo').val("");
    return false;  
  });
  
  $('.glyphicon-star').on("click", function() {
    $(this).toggleClass('active');
  });
  $('.glyphicon-remove').on("click", function() {
    $(this).parent().remove();
  });
};

$(document).ready(main);

Does anyone have any suggestions?


#2

This should not be written as a jQuery object.

var html = template(text);

#3

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.