I have a problem to use "replaceChild" to active "if" and "else"

Hi guys! I have a problem.
https://justpaste.it/6e73k
In this code there is a list, and if its first name is "Coffee", when I click the button "Appearances" it will bring me to another page where there is the word "uff".
If the first name of the list is "Water" a child appears.
The first name is "Coffee" but if I click button "Change the first food", the name "Water" replaces the name "Coffee", so clicking "Appearances" a child would have to appear. But this mechanism doesn't work.
In both cases it always brings me to the other page where there is the word "uff".
Can you help me to fix it?

Comments

[Ian Owira]

What is it that you're ultimately trying to achieve? I can see a few issues within your script which causes things thing to not work properly.

[AndyBullet]

What I want it to do is to make the image appear if the first name written on the list is "Water" and I want to make the word "uff" appear if the first name written on the list is "Coffee".
I put the button "Change the first food" to change the fist name of the list.

[Ian Owira]

Okay. So your main issues are that you're not using the correct properties for what you're trying to target.

let name = document.getElementById('food').value;

This line is failing because there is no value property for the getElementByID method. It's meant to be innerHTML if you want to retrieve the text value.

document.write(uff);

This here inside your else statement is also incorrect.

1. 'uff' is a variable that has not been defined.
2. document.write will clear the entire screen and print out whatever arguments you've placed inside there.

Here you can find a pen of more or less how it should look.