Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript Build an Interactive Website Form Validation and Manipulation Text Input Events

Neslee Rodillo
Neslee Rodillo
19,615 Points

I don't understand the error I receive from this task: Form Validation and Manipulation Challenge Task 1 of 2

I have watched the video a number of times but do not understand where I am going wrong with relation to the code challenge:

Question - Challenge Task 1 of 2

Hide all elements with the class of 'hint'.

My Solution-

<!DOCTYPE html>
<html>
<head>
    <title>Text Input Events</title>
</head>
<body>

    <p>
        <input type="text"><span class="hint">Type in something cool</span>
    </p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="app.js">
  $('.hint').hide();
  </script>
</body>
</html>

Error message I receive - Bummer! There was an error with your code: TypeError: 'undefined' is not an object (evaluating '$.calls.jQuery.length')

3 Answers

Colin Bell
Colin Bell
29,679 Points

Dont put code between script tags that are loading an external script file.

either put the code in the app.js file itself

app.js
$('.hint').hide()

or create a new script tag, without the src attribute, after the app.js script tag.

index.html
<!DOCTYPE html>
<html>
<head>
    <title>Text Input Events</title>
</head>
<body>

    <p>
        <input type="text"><span class="hint">Type in something cool</span>
    </p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="app.js"></script>

<!-- Make sure to add after the file is loaded -->
<script>
  $(".hint").hide();
</script>

</body>
</html>

whats your JQuery code?

Also '$.calls.jQuery.length seems wrong usually it is something like: $(".calls").

Gareth Borcherds
Gareth Borcherds
9,372 Points

There are two tabs for the code challenge. The app.js file is open in another tab. And as they stated above, you'll just need to put $('.hint').hide(); in the app.js file to pass the challenge.