In addition to modifying or creating an element from scratch, the DOM also allows for the removal of an element. The .removeChild()
method removes a specified child from a parent.
let paragraph = document.querySelector('p'); document.body.removeChild(paragraph);
In the above example code, the .querySelector()
method returns the first paragraph in the document. Then, the paragraph
element is passed as an argument of the .removeChild()
method chained to the parent of the paragraph—document.body
. This removes the first paragraph from the document body.
If you want to hide an element rather than completely deleting it, the .hidden
property allows you to hide it by setting the property as true
or false
:
document.getElementById('sign').hidden = true;
The code above did not remove the element with ID of 'sign'
from the DOM but rather, hid it.
Instructions
First, save the element with the ID of vespa
as a variable named elementToRemove
.
The elementToRemove
element is a child of the list of top attractions with the ID of italy-attractions
.
Remove the elementToRemove
element from its parent.