loading...

Select a DOM element with getElementByID

theianjones profile image Ian Jones Updated on ・1 min read

Get Started with JavaScript in the DOM (4 Part Series)

1) WTF is the DOM? 2) Select an Element with document.querySelector 3) Select a DOM element with getElementByID 4) Add a Node to Your HTML with document.appendChild

If you would prefer to watch this post, you can do so with this community resource lesson on egghead.io.

Getting an element by id is so common that the document object has a helper function for us to use.

Given this html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Select an Element with document.getElementById</title>
  </head>
  <body>
    <ul>
      <li id="movie-1">Peanut Butter Falcon</li>
      <li id="movie-2">Knives Out</li>
    </ul>
  </body>
</html>

We can grab our <li id="movie-2">Knives Out</li> by calling document.getElementById('movie-2').

That's it!

Get Started with JavaScript in the DOM (4 Part Series)

1) WTF is the DOM? 2) Select an Element with document.querySelector 3) Select a DOM element with getElementByID 4) Add a Node to Your HTML with document.appendChild

Posted on by:

Discussion

markdown guide