Select the first list item element and store it in the variable firstListItem

let firstListItem = document.getElementById('first');

("first") is the id coming from the HTML tag on the Index file provided.

All acceptable and passable answers below. All will pass, but the expectation is to use the first method as the video is focused on it.

let firstListItem = document.querySelector('li:first-child');
let firstListItem = document.querySelectorAll('li')[0];
let firstListItem = document.querySelector('li', [0]);
let firstListItem = document.getElementsByTagName("li")[0];

Good luck all!

The best way to answer this question is by performing the following:

let myList = document.querySelector("ul");

let firstListItem = document.querySelector('li', [0]);

let firstListItem = document.querySelectorAll("li")[0]; worked for me.

Sometimes when storing objects in variables etc its good to use jQuery that way its a case of doing the following.

      var myList = $('ul'),
            firstListItem = myList.find('l:first-item');

or if you don't want to use jQuery then

         var myList = document.getElementsByTagName('ul')[0],
               firstListItem = $document.getElementById('first');

You have an id on the first list item so you can target that for ease.

EDIT:

Or you could also use

    document.querySelectorAll("li:first-child");

This also passed the challenge....

let firstListItem = document.querySelector("ul li");

Since the Document method querySelector() returns the first Element within the document that matches the specified selector.

let firstListItem = document.querySelector("li");

this passed for me

This is an easy way: let firstListItem= document.getElementById("first");

I was able to get by like this:

let myList = document.querySelector('ul'); let firstListItem = document.querySelector('li, first');

var firstListItem = myList.querySelector('#first');

I tried different ways but none of them worked until I used the # to indicated a ID var firstListItem = document.querySelector('#first'); since it was only one ID with #first I was able to use it

I really struggled with using the first-child method and had to opt for TagName method instead

let firstListItem = document.getElementsByTagName("li")[0];

If anyone knows where I am going wrong with document.querySelector("li:first-child"); or cant it be used in this scenario?