Render HTML Elements to the DOM - SOLVED

JavaScript
1

Issue:
Hey guys,

I don’t understand why I’m getting the following message:

“The provided JSX element should render to the DOM node with id challenge-node.”

Everything seems fine to me - any ideas please?

My code so far:

const JSX = (
  <div id="challenge-node">
    <h1>Smth</h1>
    <p>Lets render this to the DOM</p>
  </div>
);
// change code below this line

ReactDOM.render(JSX,document.getElementById('challenge-node'));

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.132 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/react/render-html-elements-to-the-dom

2

The challenge is expecting that the JSX has not been changed.

Also the div in the JSX shouldn’t have the id="challenge-node" attribute, because there’s already an existing div with that ID (which you’ll then access at the last line).

Other than that the last line is good.

1 Like
3

in the tag <h1>Smth</h1>, put it back to <h1>Hello World</h1> and it should work!

Also no need to put the id challenge in this <div id="challenge-node">, FCC already put that for you behind the scene!

1 Like
4

Many thanks gentlemen, that cleared it up.

Cheers!