Passing a DOM element as a function parameter

In previous lessons, we passed element selectors to our functions, and our functions themselves obtained references to these elements within their code. There is another approach: you can pass earlier obtained references to elements into functions.

Let's look at an example. Let's say we have the following code:

<p id="elem1"></p> <p id="elem2"></p>

Let's make a function setText, which will take a reference to the DOM element as the first parameter, and the element's text as the second:

function setText(elem, text){ elem.textContent = text; }

Using the function we created to set the text of our paragraphs:

let elem1 = document.getElementById('elem1'); setText(elem1, 'text1'); let elem2 = document.getElementById('elem2'); setText(elem2, 'text2');

Make the function appendText that takes a DOM element as the first parameter and text as the second. Make this function add text to the end of this element.

Given paragraphs. Get them, loop through and add '!' to the end of each using the appendText function made in the previous task.

Make the function setValue, which will take a reference to the input as the first parameter, and the text as the second. Make this function set the passed text to value of the input.

enru