I get stuck on this challenge so i need help.
A website needs a list where users can rank their favorite foods. Write the setup function, which should register click handlers on all Up! and Down! buttons. The Up! button should move the list item one place up in the list, while Down! button should move the list item one place down in the list.
For example, consider this code:
document.body.innerHTML = `<ol>
<li><button>Up!</button>Taco<button>Down!</button></li>
<li><button>Up!</button>Pizza<button>Down!</button></li>
<li><button>Up!</button>Eggs<button>Down!</button></li>
</ol>`;
setup();
If the button Up! button in Pizza list item is clicked, Pizza should be the first item in the list, while Taco should be the second item
THIS IS MY CODE
function setup() {
let list = document.getElementByTagName('li');
let btnList = document.getElementByTagName('button');
let up;
let down;
for (let l = 0; l < list.length; l++){
for (let b = 0; b< btnList.length; b++){
btnList[b].addEventListener("click", (item, index)=>{
if(btnList[b].textContent == "Up!"){
up = list[l - 1]
} else if(btnList[b].textContent == "Down!"){
down = list[l + 1]
} else{
return list
}
})
}
}
return list;
})
}
}
Please no Jquery.