Good Dog explainer

The aim of this puzzle: Use JavaScript to add new elements to HTML.

Walkthrough of the solution:
The appendChild method adds an HTML element as a “child” of another element. For example:

let paragraph = document.createElement(‘p’);
document.body.appendChild(paragraph);

The code above creates and then adds a new paragraph element as a child of <body>. The resulting HTML would be:

<body>
  <p>new paragraph element</p>
</body>

In this puzzle, you’ll append 2 paragraphs to the body element.

To complete the puzzle, in the JavaScript, use document.body.appenChild() to append text2 to the body. Repeat, this time appending text3 to the body.

Sample code solution:
(Tap below to reveal)

let picture = document.createElement('img');
picture.src = '../../static/images/sfDog.jpg';

let text1 = document.createElement('p');
text1.textContent = 'I am a good boy.';

let text2 = document.createElement('p');
text2.textContent = 'I like my chew toy.';

let text3 = document.createElement('p');
text3.textContent = 'I like bringing joy.';

document.body.appendChild(picture);
document.body.appendChild(text1);
document.body.appendChild(text2);
document.body.appendChild(text3);

JavaScript Concepts: .textContent, .createElement(), document, body, .appendChild(), Variables, document body