This forum is now read-only. Please use our new forums! Go to forums
What is wrong with my code?
I am trying to declare a variable $target. I am selecting the 4th li tag in an ordered list. However I am getting a syntax error report. The JS code is below:
// Write your jQuery code on line 3! $(document).ready(function() { var $target = li:nth-child(4); $target.fadeOut(‘fast’); });
Answer 5581f18ce0a300f2cf0008bc
This is not a valid statement since we cannot write CSS selectors as identifiers in JavaScript (or jQuery). They must be strings.
"li:nth-child(4)"
But that is not where it ends. The $ prefix on the variable suggests we are referencing a jQuery object, one of which the above is not. This is: $()
. And since there are both UL and OL in the HTML, and the instructions ask for only the fourth child of an OL, we need to specify that in our CSS selector:
"ol li:nth-child(4)"
Now putting it all together, we get,
$target = $("ol li:nth-child(4)");
Answer 558207ece39efef63f0002a3
D O M - representation of index.html
Line-numbers from the index.html file included..
1-document
2-html
|
+-----------+---------+
| |
3 head 7 body
| |
+---+--+ 8 div
| | |
4title 5script 9 ul
|
+-------+---+-------+
10-li 18-li 19-li
|
11-ol
|
+---+---+---+---+
| | | |
li li li li
12 13 14 15
jQuery-Selector::
Reference::
google search selector site:jquery.com https://learn.jquery.com/using-jquery-core/selecting-elements/
what is CSS explained site:developer.mozilla.org https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started/What_is_CSS https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
http://stackoverflow.com/questions/1795438/load-and-execution-sequence-of-a-web-page
Use this in your script.js file….
$(document).ready(function() {
// var $target=$('ol li:last-child');
// $target.fadeOut('fast');
// direct targeting, remove/add // per line
// $('html').text('=target0=');
// $('html>body>div>ul>li').text('=target1=');
// $('html>body>div').text('=target2=');
// $('li>nth-child(3)').text('=target3=');
// $('li').text('=target4=');
// $('ul>li:nth-child(3)').text('=target5=');
// $('ul li:nth-child(3)').text('=target6=');
// $('ol li:nth-child(3)').text('=target7=');
// $('ol').hide();
});
1 comments
Thanks Leon, this helps a lot.
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
Thank you Roy it works now