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 jQuery Basics Working with jQuery Collections The .each() method

Posted by Joseph Chauvin
.a{fill-rule:evenodd;}techdegree
Joseph Chauvin
Full Stack JavaScript Techdegree Student 12,029 Points

Does anybody know where I am wrong here? Can't seem to figure it out...

Does anybody know where I am wrong here? Can't seem to figure it out...

index.html 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h2>My Favorite Things</h2>

    <ul class="favorite-things">
        <li>Kittens</li>
        <li>Rainbows</li>
        <li>Unicorns</li>
        <li>Sprinkles</li>
    </ul>

    <script
    src="jquery-3.2.1.min.js"></script>
    <script src="app.js"></script>
</body>
</html>
app.js 
$('.favorite-things li').each(function() {
  $(this).prepend($('<input type="checkbox"/>'));
});
Lucan Fraser
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Lucan Fraser
Full Stack JavaScript Techdegree Graduate 16,816 Points
Lucan Fraser
.a{fill-rule:evenodd;}techdegree seal-36
Lucan Fraser
Full Stack JavaScript Techdegree Graduate 16,816 Points

You could console.log the $('.favorite-things li') selector to see what you get, which always helps me. But I believe that you could remove .favorite-things and it will work. you may also want to remove the bullet points from the list items. li { list-style: none;}

1 Answer

scribbles
scribbles
21,173 Points

Just pass in the '<input type="checkbox"/>' straight to the prepend method as a string:

$('.favorite-things li').each(function() {
  $(this).prepend('<input type="checkbox"/>');
});