This forum is now read-only. Please use our new forums! Go to forums
12/14 why do I have to use '<div class="item">' + toAdd + '</div>'
$(".list").append('<div class="item">' + toAdd + '</div>');
This code is right but I’m not sure why I had to say
'<div class="item">' + toAdd + '</div>'
instead of just “.item” for the item class instead of the
Answer 55679152e0a30068920003be
This is a dynamically generated string of parseable HTML.
'<div class="item">' + toAdd + '</div>'
When appended to the DOM it will look like this:
<div class="item">Whatever toAdd is</div>
Notice how the class attribute is written? No dot. In fact a dot would make the class name invalid, since its CSS selector would be, ..item
, which is also invalid.
"item"
is a class name. .item
is a CSS class selector, and '.item'
is a jQuery class selector.
Answer 556862c076b8fec40d0004b0
On the very next one, 13/14, this is the passing code:
$(document).ready(function() {
$('#button').click(function() {
var toAdd = $('input[name=checkListItem]').val();
$(".list").append('<div class="item">' + toAdd + '</div>');
});
$(document).on('click', '.item', function() {
$(this).remove();
});
});
It let me use '.item'
for the .on()
Answer 5568615be39efea7e30007d0
I probably should have worded my question better. Why is it that we need to use the class name and div tags instead of just using the jQuery class selector to say what to add ? It’s the only thing with that ID so why not just say
'.item' + toAdd
or
toAdd + '.item'
2 comments
A class name is only a property of an element, not an element itself. Plus it is not unique; every item we add to the list has the same class attribute.
Oh ok! Good point, thank you
Popular free courses
- Free Course
Learn SQL
In this SQL course, you'll learn how to manage large datasets and analyze real data using the standard data management language.Beginner friendly,4 LessonsLanguage Fluency - Free Course
Learn JavaScript
Learn how to use JavaScript — a powerful and flexible programming language for adding website interactivity.Beginner friendly,11 LessonsLanguage Fluency - Free Course
Learn HTML
Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.Beginner friendly,6 LessonsLanguage Fluency
1 comments
And now you see where the class is selected in an event handler. The Add! click event creates new elements of class “item”, and the item click event handler removes the item that was just clicked.