Practice Set, Week 8, Modifying the DOM, Problem 1

by mtzara

HTML

<h3>Practice Set #1, Week 8, Modifying the DOM</h3>

<p>We're going to move a DOM element from one location to another in this HTML document. Your task is to remove the element <code>#moveMe</code> from <code>#oldParent</code> and add it to the element <code>#newParent</code>.</p>
<p>Hint: this may require fewer steps than you think. Read the first paragraph of the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Node.appendChild" target="_blank">MDN Node.appendChild() docs</a> for guidance.</p>
<b>Dogs</b>

<ol id="oldParent">
    <li>Simon</li>
    <li id="moveMe">Baxter</li>
    <li>Ripley</li>
</ol>
<b>Famous Dogs</b>

<ol id="newParent">
    <li>Lassie</li>
    <li>Astro</li>
    <li>Scooby</li>
</ol>

JavaScript

var NewParent = document.getElementById("newParent");
var moveMe = document.getElementById("moveMe");
NewParent.appendChild(moveMe);


// some suggested steps:
// 1)  Get the elements for the ids 'moveMe', 'oldParent', and 'newParent' and assign them to variables 
//       (You actually will not need all three of these, you only need two. Part of the task is to figure out which two. Refer to the MDN docs linked in the HTML for guidance.)


// 2) Now, use appendChild() to make the move happen.