'Setting a parameter of a function, but using an argument

so I was watching a tutorial explaining how to make a simple To-Do list, and looking at the code in the video I found that the person who wrote the code typed in "todo" as a parameter(todos.forEach(function(todo) part), and it was called below in the code, but what is the argument, if the whole function is called when the DOM content is loaded?

document.addEventListener("DOMContentLoaded", getTodos)

function saveLocalTodos(todo) {
  //CHECK--IS LOCALSTORAGE OR NOT
  let todos
  if (localStorage.getItem('todos') === null) {
    todos = []
  } else {
    todos = JSON.parse(localStorage.getItem('todos'))
  }
  todos.push(todo)
  localStorage.setItem('todos', JSON.stringify(todos))
}

function getTodos() {
  let todos
  if (localStorage.getItem('todos') === null) {
    todos = []
  } else {
    todos = JSON.parse(localStorage.getItem('todos'))
  }
  todos.forEach(function(todo) {
    console.log("hello")
    //todo DIV
    const todoDiv = document.createElement("div")
    todoDiv.classList.add("todo")
    //create LI
    const newTodo = document.createElement("li")
    newTodo.innerText = todo
    newTodo.classList.add("todo-item")
    todoDiv.appendChild(newTodo)
    //ADD TODO TO LOCALSTORAGE
    //CHECK MARK BUTTON
    const completedButton = document.createElement("button")
    completedButton.innerHTML = `<i class="fas fa-check"></i>`
    completedButton.classList.add("complete-btn")
    todoDiv.appendChild(completedButton)
    //CHECK TRASH BUTTON
    const trashButton = document.createElement("button")
    trashButton.innerHTML = `<i class="fas fa-trash"></i>`
    trashButton.classList.add("trash-btn")
    todoDiv.appendChild(trashButton)
    //APPEND TO LIST
    todoList.appendChild(todoDiv)
  })
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source