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

Octavia Kelly
seal-mask
.a{fill-rule:evenodd;}techdegree
Octavia Kelly
Front End Web Development Techdegree Student 3,556 Points

Set the text content of the a tag to be the value stored in the variable inputValue.

I've looked at a lot of the comments regarding this question, and can't understand why my code doesn't work. Please could someone enlighten me! Thanks very much.

app.js
let inputValue = document.getElementById('linkName').value;
let link = document.getElementById('link').textContent;
inputValue = link;
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>
Joseph Chiang
Joseph Chiang
3,942 Points

hey Octavia,

let me just show you the code i used first

let inputValue = document.querySelector('#linkName').value;
let a = document.querySelector('a');
a.textContent = inputValue;

Regarding the second line, the reason why your code doesn't work is because you have the '.textContent' at the end of the selector, and it won't be able to select that. Instead, put 'link.textContent' on your third line. Also, because you need to 'Set the text content of the a tag to be the value stored in the variable inputValue', the 'inputValue' needs to be on the right side of the equal sign since the text content of the 'a' is being stored into 'inputValue'. The left side of the equal sign always goes into whatever is on the right side of the equal sign. Hope that helps!

Cheers, Joseph

2 Answers

Dale Severude
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Dale Severude
Full Stack JavaScript Techdegree Graduate 71,349 Points

Hi Octavia,

In line number two, you don't want to capture the links textContent, you just want to select the link element itself.

let link = document.getElementById('link');

In line number three, you want to set the textContent of the link to the value captured in your first line.

link.textContent = inputValue;