Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Gary Christie
Gary Christie
5,151 Points

I dont understand fully what this is doing. Please explain

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

2 Answers

Samuel Webb
Samuel Webb
25,370 Points
Samuel Webb
Samuel Webb
25,370 Points

I went through and commented each line to the best of my abilities so you could see exactly what's going on. There was a single quote mark in the append() function which was an issue and you didn't have the final closing }); or whatever that's called. I didn't test the code to see if it actually does what it's supposed to, but at least you now know what each line means.

Also, that append() function is doing nothing useful in this code. Inside the parenthesis is where you would put what you want to append to elements with the "list" class.

$(document).ready(function(){  /* Waits until page is fully loaded to start what this function contains */

    $(document).on('click','item', function() { /* When document is clicked, do function on 'item' */

        $(this).remove();  /* Remove 'item' from the page */

        $('#button').click(function(){ /* When the element with the ID of "button" is clicked */

            var toAdd= $('input[name=checkListItem]').val(); /* Create variable "toAdd" with the value of the input field with the name "checkListItem" */

            $('.list').append(); /* Append nothing to the element with the class "list" */

        }); /* Closes button click function */

    }); /* Closes item click function */

}); /* Closes ready function (wasn't originally in code) */
Gary Christie
Gary Christie
5,151 Points
Gary Christie
Gary Christie
5,151 Points

I understand. I get what was confusing me. Inside of append('<p>' + toAdd +'</p>'). I understand that now that what ever was in the class 'list' had to put in the value of input which was the variable toAdd, at the end of the element .list.

Samuel Webb
Samuel Webb
25,370 Points
Samuel Webb
Samuel Webb
25,370 Points

Sweet man! Glad you got it.