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 Brian Johnson
.a{fill-rule:evenodd;}techdegree seal-36
Brian Johnson
Front End Web Development Techdegree Graduate 20,818 Points

Please help. I've hit a bump and i am trying to understand how to solve this.

Can anyone help me out on this?

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() {
  // Write code here
   const href = $('li');
   $([href^="checkbox"]).prepend(this);
});

2 Answers

Hakim Rachidi
Hakim Rachidi
38,490 Points
Hakim Rachidi
Hakim Rachidi
38,490 Points

The challenge was to prepend a checkbox to a li. In an jQuery $().each loop this references the li element (In this case).

Inorder to prepend a element you have to define it: 

var checkbox = '<input type="checkbox"/>';

And prepend it via jQuery:

$(this).prepend(checkbox);

Do not forget $() inorder to use jQuery

Brian Johnson
.a{fill-rule:evenodd;}techdegree seal-36
Brian Johnson
Front End Web Development Techdegree Graduate 20,818 Points

So I tried that.. $('.favorite-things li').each(function() { // Write code here var checkbox = '<input type="checkbox"/>'; $(this).prepend(checkbox); });

and it told me AST unexpected node call pass expression: Literal..

Hakim Rachidi
Hakim Rachidi
38,490 Points
Hakim Rachidi
Hakim Rachidi
38,490 Points

Hi, Brian

Sorry I don't know what this error means(maybe a bug in workspaces because I can not find any explanation in the web), but if you pass the string directly to the prepend method like this

$(this).prepend('<input type="checkbox"/>');

Hope this works Know this works