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 JavaScript and the DOM (Retiring) Making Changes to the DOM Modifying Elements

Christina Araujo
seal-mask
.a{fill-rule:evenodd;}techdegree
Christina Araujo
Full Stack JavaScript Techdegree Student 4,819 Points
Posted by Christina Araujo
.a{fill-rule:evenodd;}techdegree
Christina Araujo
Full Stack JavaScript Techdegree Student 4,819 Points

I am at a loss, here! I keep failing this challenge and am starting to feel a little down about this.

I feel like I keep following the lessons and yet I am still being quizzed on parts of javascript that I haven't learned yet.

I have just learned the textContent method etc and it seems like a method that would be useful to use here, but I am so wrong.

I am having a very difficult time connecting the dots.

app.js 
let inputValue = document.getElementById('linkName').value

a.textContent = inputValue;
index.html 
<!DOCTYPE html>
<html>
    <head>
        <title>DOM Manipulation</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <div id="content">
            <label>Link Name:</label>
            <input type="text" id="linkName">
            <a id="link" href="https://teamtreehouse.com"></a>
        </div>
        <script src="app.js"></script>
    </body>
</html>
Daniel Bouse
Daniel Bouse
9,838 Points
Daniel Bouse
Daniel Bouse
9,838 Points

The browser doesn't know what a.textContent means because you haven't declared a variable called "a" yet. You have to target the anchor tag with another .getElementById and store that value in a variable. let inputValue = document.getElementById('linkName').value; let a = document.getElementById('link');

a.textContent = inputValue;

2 Answers

Brendan McCray
Brendan McCray
5,597 Points
Brendan McCray
Brendan McCray
5,597 Points

You have the right idea. As Joel said, you should select the <a> tag using one of a few viable methods. Here's one answer:

  • let inputValue = document.getElementById('linkName').value;
  • document.querySelector('a').textContent = inputValue;
Joel Bardsley
Joel Bardsley
31,249 Points
Joel Bardsley
Joel Bardsley
31,249 Points

In your code, you've set a.textContent = inputValue but you haven't specified what a is.

You can either create the new variable a to get this line of code to work, or instead of creating another variable, do another element selector and update its textContent directly, whichever makes the most sense to you.

Good luck!