JavaScript JavaScript and the DOM Traversing the DOM Getting the First and Last Child

Gbadebo Ogunbanjo
Gbadebo Ogunbanjo
8,123 Points

My Solution to Guil's closing challenge

const listDiv = document.querySelector('.list'); var ul = document.querySelector('ul'); const upButtons = ul.querySelectorAll('.Up'); const downButtons = ul.querySelectorAll('.Down'); const listUl = listDiv.querySelector('ul');

function redundantButton() { let funcul = document.querySelector('ul');

let topLi = funcul.firstElementChild; let topUpButton = funcul.firstElementChild.querySelector('.Up'); let bottomDownButton = funcul.lastElementChild.querySelector('.Down'); topUpButton.style.backgroundColor = "#fff"; topUpButton.style.border = "none"; bottomDownButton.style.backgroundColor = "#fff"; bottomDownButton.style.border = "none"; }

listUl.addEventListener('click', (event) => {

for (let i=0; i<ul.children.length; i++){ upButtons[i].style.backgroundColor = "#52bab3"; downButtons[i].style.backgroundColor = "#508abc";
}

redundantButton();

});