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

Code challenge JQuery introduction

Hi,

On the code challenges after "Jquery" introduction, I can't figure out what is the answer of this :

On the next line, use jQuery to select all list items (li) in an unordered list (ul) with the class of 'nav'?

the link is : http://teamtreehouse.com/library/build-an-interactive-website/introduction-to-jquery/using-jquery-to-select-elements

And the answer I tryed is :

$("#container");
 $("ul li nav")

Anyone can help ?

Thanks ! Romain

8 Answers

Chase Lee
Chase Lee
29,275 Points

Do this:

function requiredValues(){
  var total = new Array();
  $("input.required").each(function(){
    total.push($(this).val());
  });  
    return total;
}
Chase Lee
Chase Lee
29,275 Points

So select the ul with the class .nav, Which would look like ul.nav the select all of the list items inside of it. Which would look like ul.nav li. Then add a semi colon to the end.

It would look like this:

$("ul.nav li");
Matthew Mascioni
Matthew Mascioni
20,444 Points

Hi Romain,

The question is telling you to select all 'li' elements within a ul. The 'ul' has a class of "nav".

In jQuery, we select classes just like we would in CSS! (prefixed with a dot- '.')

So, your selector would look something like:

$("ul.nav li);

Hope this helps!

Christopher Leonard
Christopher Leonard
11,172 Points

Why isn't it

$(".nav ul li);

That's how we would select those li's in CSS

Sweet ! got it.

thank you both ;) Romain

Chase Lee
Chase Lee
29,275 Points

Because by writing this you are still selecting an element using jquery. You need to enclose it with a $ and parentheses. Like this:

$(this).remove();

Another question for you guys :

this challenge : http://teamtreehouse.com/library/build-an-interactive-website/introduction-to-jquery/including-jquery-in-our-project

I put :

<!DOCTYPE html>
<html>
<body>


<div id="message">
        <p>Congratulations!</p>
</div>


<ul>
        <li class="removable">Item 1</li>
        <li class="removable">Item 2</li>
        <li class="removable">Item 3</li>
</ul>


<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $("#message").hide().show("slow");
  $(".removable").click( function () {
        this.remove();
  });
</script>
</body>
</html>

but I get Bummer! null

Any idea ?

Thanks !

Romain

Hi Again !

I'm having a hard understanding this now :

The link is : http://teamtreehouse.com/library/build-an-interactive-website/form-validation-and-manipulation/checking-values

The question is : Create a method called 'requiredValues' that returns an array of all the values of inputs with the class of 'required'.

Any my answer is :

function isValidEmail(email){
  return email.indexOf("@") != -1;
}

var $required = $(".required");

function requiredValues(){
  var arrayOfValues = new Array();
  $required.each(function(){
    return arrayOfValues.push($(this).val());
  });
}

And it returns me : Bummer! There is something wrong with your code in your 'requiredValues' function.

Any idea whats wrong ?

Thanks a lot ! Romain

That works !

Thank you !