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()

Diana Chong
Diana Chong
5,457 Points

Adding jQuery attribute and new value

This is the challenge question: Using jQuery only, add to all links with the class "external", the target attribute with the value of "_blank".

This is my code: $(".external").append("href"); $(this).attr("target", "_blank");

I'm not sure what I've done wrong. Please help!

js/app.js
$(".external").append("href");
$(this).attr("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>

4 Answers

Steven Parker
Steven Parker
229,783 Points

Everyone seems to be getting close, but no one's actually hit it yet.

It does say to add to all links with the class "external". You got the class part right, using the dot, but you're targeting all elements with that class. To do what the challenge asks, you need to target just the links ("a" elements) with that class. So the selector should be: a.external.

Max and Patrick got the part about setting the attribute right. So combining everything you get:

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

Note, leaving off the "a" might still pass, but it's not quite what was asked for.

So you're almost there! All the right pieces to make this work are already there, there are just a few bits of things in between that aren't needed. The question just wants you to select all existing links with the class "external", which you've already done by saying $("external") in your first line of code. Then, it wants you to add the attribute "target" with the value "_blank" to those selected links, which you've correctly written in your next line of code, the .attr("target", "_blank") part. So, simply put those two pieces together, and you should be all set! If you're looking for a little more detail, I've added some below.

A good place to check when you're having issues in code challenges is the preview (by clicking the "Preview" button). This will run your current code and can be useful for debugging to see if there's anything obviously wrong happening. In this case, if you access the preview you can see that the text "href" is being added to all existing links with the class "external", which probably isn't what you want. That's happening at this line of code:

$(".external").append("href");

Also briefly, the this keyword in JavaScript can be extremely confusing. There are entire materials devoted to helping try and clear it up (I think Treehouse even has some in the form of workshops and other resources), so I won't go into too much detail here, but your line of code:

$(this).attr("target", "_blank");

is selecting the window element (browser window) in this context. So, this is essentially the same as writing $(window).attr("target", "_blank").

Max Dubinin
Max Dubinin
12,807 Points

try this: $(".external").attr("target","_blank")

Diana Chong
Diana Chong
5,457 Points

Thank you gentlemen for all your help! I thought about the "a" elements when I was away from the computer too. Appreciate you all for your quick responses!