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

Rasbin Rijal
PLUS
Rasbin Rijal
Courses Plus Student 10,864 Points
Posted by Rasbin Rijal
Rasbin Rijal
Courses Plus Student 10,864 Points

Using jQuery only, add to all links with the class "external", the target attribute with the value of "_blank".

JQuery adding all links' target attribute blank. Couldn't solve this!!!

js/app.js 
.external a{
  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>

1 Answer

Tobias Helmrich
Tobias Helmrich
31,603 Points
Tobias Helmrich
Tobias Helmrich
31,603 Points

Hey there Rasbin,

you should solve this challenge with jQuery but to me it looks like you're trying to use CSS for this which is wrong as this is not about styling an element.

To solve this challenge with jQuery you first have to select all links with the class of external. Then you have to use the attr method and give it two arguments, the first one is the attribute's name and the second one is its value.

Like so:

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

I hope that helps, good luck! :)

Keith Corona
Keith Corona
9,553 Points
Keith Corona
Keith Corona
9,553 Points

Do you even have to add the 'a.external - it seems to me that since only the links are given the class "external" that you don't need to distinguish "a."

Tobias Helmrich
Tobias Helmrich
31,603 Points
Tobias Helmrich
Tobias Helmrich
31,603 Points

Hey there,

if only the links would have the class external it would be okay to not write the a, yes. However if you can't be sure and there could be other elements with the class of external you should specify it to prevent unwanted behavior. As the challenge specifically says that links with this class should get the value of _blank for the target attribute it's best to add it in this case even though the challenge would also pass without adding it.