13. Remove What's Been Clicked (syntax question and another confusion question)


#1

My first question is about syntax and whether a dot is needed or not

The last part of the instructions
and the thing we'll want to do is call .remove() on this.

So I added this:

$(".item").on('click', '.item', function() {
.remove(this);

Which returns an "Uncaught SyntaxError: Unexpected token ."

So I tried the code without the period before remove(this);

This gets rid if the error. So I guess I've answered the first question myself... the dot is not need. So why do the instructions say to include it?

The newt question is about the point of the entire exercise:
I thought the point of the exercise was to make it so the new items appended are removed when clicked.
I've added .on("click") function but the appended items do not remove.

What gives?


#2

@textrockstar34699

When you select an element to modify it in jQuery, you use dot only if you're selecting a class. Per example:

$('.className')

#3

So it should be $("item").on('click', 'item', function()

?


#4

@textrockstar34699

It depends on what type of item you're selecting. If you're selecting an element it's like this:

$("item")
``` 

or for a class

```
$(".item")
``` 

 or for id

```
$("#item")

#5

Thanks. That's clear.

Any idea what's wrong with my code? I'm getting this error now

Oops, try again. Did you call .on() on $(document) ?

My code looks like this now:

 $(document).ready(function() {
     $("#button").click(function() {
         var toAdd = $('input[name=checkListItem]').val();
         $(".list").append('<div class = "item">' + toAdd + '</div>')
         
     });
     $("item").on('click', 'item', function() {
           remove(this);  
     });
 });

#6

Try the code below- it works for me and I am able to do everything it suppose to do- add and remove items. To remove items added, just click on the item you would like to remove then it will disappear.

$(document).ready(function(){
$('#button').click(function(){
var $toAdd= $('input[name=checkListItem]').val();
$('.list').append('

'+ $toAdd +'
');
})
$(document).on('click', '.item', function(){$(this).remove()});
});

#7