13/14 i dont know where to put the .on() string


#1

So my code is..

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

But I need to add...

$(document).on('click', '.item', .remove(this) {

(i dont think i wrote that right so please correct it)

Where do I put it?


#2

Hi Rachel,

You'll need to add the new code after $('#button').click(function() {...});, but still inside the $(document).ready(function() {...}); :)

And the correct way to write that would be:

$(document).on("click", '.item', function() {
  // code here
});

#3

Technically, this line does not need to be deferred since it is not waiting for any elements to load. The document is already present so this handler can be outside of the ready() handler. However, in keeping with the instructions, your advice is good and valid, @zystvan.

Consider,

$(document).on('click', '.item', function() {
    // event handler code
}).ready(function(){
    // deferred code
});

#4

@mtf Notice that concatenating that way won't be evaluated as a correct answer (came from the exercise to report the bug).


#5

It's not really meant as one, more to demonstrate that deferral is not required for the listener.


#6

A post was split to a new topic: Where is a bug?


#7

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

"+toAdd+"
");
});
$(document).on("click", '.item', function() {
// code
});
});