In the listener that has been added to the section element, ensure that the text input elements are the only children th

Question

Anybody got the answer?

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>JavaScript and the DOM</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <section>
            <h1>Making a Webpage Interactive</h1>
            <p>JavaScript is an exciting language that you can use to power web servers, create desktop programs, and even control robots. But JavaScript got its start in the browser way back in 1995.</p>
            <hr>
            <p>Things to Learn</p>
            <ul>
              <div>
                <li>Item One: <input type="text"></li>
                <li>Item Two: <input type="text"></li>
                <li>Item Three: <input type="text"></li>
                <li>Item Four: <input type="text"></li>
              </div>
            </ul>
            <button>Save</button>
        </section>
        <script src="app.js"></script>
    </body>
</html>

app.js

let section = document.getElementsByTagName('section')[0];

section.addEventListener('click', (div) => {
  textInput.target.style.backgroundColor = 'rgb(255, 255, 0)';
});

Answer 1 · 2017-03-23T15:03:56Z

March 23, 2017 3:03pm

since it is named div in your event handler. You should use the target.tagName property for the div object.

let section = document.getElementsByTagName('section')[0];

section.addEventListener('click', (div) => { if(div.target.tagName == 'INPUT') { div.target.style.backgroundColor = 'rgb(255, 255, 0)'; } });

Answer 2 · 2017-03-11T01:02:21Z

March 11, 2017 1:02am

You won't want to change the event argument passed to the handler.

You don't have anything named textInput defined anyway. But if you put the code provided back to the way it was (or restart the challenge), you can accomplish the task by adding some new code to perform a test to limit when the color assignment can be done.

Hint HTML elements (including an event target) all have a tagName property that could be handy here.

Answer 3 · 2017-03-19T00:27:00Z

March 19, 2017 12:27am

Steven Parker I was doing it using h1, p and all where text. So you think "Input" is the answer?

Welcome to the Treehouse Community

Looking to learn something new?

KORAXE IUHMAGEON

KORAXE IUHMAGEON

In the listener that has been added to the section element, ensure that the text input elements are the only children th

3 Answers

Kautilya Kondragunta

Kautilya Kondragunta

Steven Parker

Steven Parker

You won't want to change the event argument passed to the handler.

ammarkhan

ammarkhan

Steven Parker

Steven Parker

ammarkhan

ammarkhan

Steven Parker

Steven Parker