I try to select a certain DOM element with jQuery.
The HTML content:
JavaScript
x
16
16
1
<html>
2
<head>
3
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script>
4
</head>
5
<body>
6
<nav id="nav" class="navigator">
7
<h1>Nav Header</h1>
8
9
<ul class="nav-list">
10
<li class="nav-item"><a >Item #1</a></li>
11
<li class="nav-item active"><a href="#2">Item #2</a></li>
12
</ul>
13
</nav>
14
</body>
15
</html>
16
I want to select Item #1. I used
JavaScript
1
2
1
$('.nav-list').children()
2
I got
TypeError: $(…).children is not a function
What’s wrong here?
Advertisement
Answer
You need to include jQuery in your page.
Most browsers nowadays include a $()
function in their console by default for easy element selection, but this simply maps to document.getElementById()
.
The value returned will not have a .children()
method.
Additionally, if you load an HTML page directly from your file system, you need to include the http://
for CDN script URLs. Otherwise, your browser will try to find the .js file on your local system.