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 (2014) Creating a Simple Lightbox Adding New Attribute Values with attr()

Posted by Russell Davidson
Russell Davidson
2,225 Points

Undefined is not an object?

I'm trying to append 'target="_blank"' to all links with the class external using only jQuery. Here is my code:

$(".external").attr("a").append("target", "_blank");

I get the error Undefined is not an object. What is causing this?

js/app.js 
$(".external").attr("a").append("target", "_blank");
index.html 
<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" title="no title" charset="utf-8">
  <title>Links Page</title>
</head>
<body>
  <h1>Links</h1>
  <ul>
    <li><a href="http://google.com" class="external">Google</a></li>
    <li><a href="http://yahoo.com" class="external">Yahoo</a></li>
  </ul>
  <script src="//code.jquery.com/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
  <script src="js/app.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

2 Answers

Kevin Korte
Kevin Korte
28,148 Points
Kevin Korte
Kevin Korte
28,148 Points

Your jquery code is looking for an element with the class of external, with an attribute of a. There is no element with an a attribute, so it comes back undefined. I don't even think there is a valid a attribute in html.

Undefined, means it can't find it, it doesn't exist.

Using the jquery documentation, since we know we want to add the attribute target="_blank", than let's take a look. We're going to jump halfway down to here: http://api.jquery.com/attr/#attr2 where it shows us how to use .attr() to add an attribute.

As you can see, it's the very first one is what we need, where it says .attr( attributeName, value ). Perfect.

So going back to the question, it's just ends up being simply `$('.external').attr('target', '_blank');'

And boom, that's it.

Jennifer Nordell
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher
Jennifer Nordell
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher

Hi there! This question seems to throw some people and most seem to think they need the append method here. This is not the case. The only method you need here is .attr(). And that method takes two strings. The first one is the attribute to be changed (which you did correctly) and the second is the value of that attribute (which you also did correctly). In fact, if I just selectively delete a little of your code, it passes! So give it another shot with these hints in mind! :sparkles: