Javascript not changing P element

I'm having issues trying to understand why my javascript code is not updating the paragraph in my html. When i type the age number in the input field and submit its supposed to display a message on the paragraph. I've tried to look at the id for both and noticed they are the same. If anyone could help me understand why its messing up i would appreciate it.

https://codepen.io/Jwfrank3/pen/mdNeMro

CodePenJwfrank3

else if Javascript

...

Ἔ

ἔρως•9/30/24, 12:04 AM

codepen is overridding the because it's adding a click handler

Ἔ

ἔρως•9/30/24, 12:04 AM

also, why are you using a click handler?

Ἔ

ἔρως•9/30/24, 12:05 AM

why don't you have a form that you then handle the submit event instead?

Ἔ

ἔρως•9/30/24, 12:05 AM

with the click event, i can't submit it without pressing enter

Ἔ

ἔρως•9/30/24, 12:06 AM

also, the logic is pretty messy

Ἔ

ἔρως•9/30/24, 12:06 AM

and the outside the function doesn't make sense

Ἔ

ἔρως•9/30/24, 12:09 AM

you also have a bug because you use instead of , which makes it so that an empty string matches instead of going to the

Ἔ

ἔρως•9/30/24, 12:10 AM

also, for a consistent parsing, use with radix set to 10

RaskinOP•9/30/24, 12:29 AM

Honestly I just copied and pasted my code from vscode to code pen just to present it better. I'm using live server with vscode to render it in a browser. I was trying to learn from a youtube tutorial from the channel brocode and he was covering if else statements. The .onclick is just what he recommended because derivitave of what used in the video earlier. I believe i have a syntax or spelling issue in the code but I've checked a million times and i don't where it is. for a beginner just stating out how can i fix the existing code base?

Ἔ

ἔρως•9/30/24, 12:32 AM

don't use

Ἔ

ἔρως•9/30/24, 12:32 AM

EVER

Ἔ

ἔρως•9/30/24, 12:32 AM

unless you have a very very very good reason to use it

RaskinOP•9/30/24, 12:32 AM

how do i make the button update the p element to display the messages in the function then?

Ἔ

ἔρως•9/30/24, 12:32 AM

use
https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

Ἔ

ἔρως•9/30/24, 12:33 AM

also, what you have there is a poor-man's form, but without a form

Ἔ

ἔρως•9/30/24, 12:34 AM

so, use a <form> as the parent, and then handle the submit event
https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit_event

Ἔ

ἔρως•9/30/24, 12:35 AM

you will need to receive the argument, which you then call
https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

Ἔ

ἔρως•9/30/24, 12:35 AM

this allows people to press enter to send the information

RaskinOP•9/30/24, 12:37 AM

This is a lot of information, I'll read through this and see what I can do. Thank you for all this it is a lot

Ἔ

ἔρως•9/30/24, 12:37 AM

oh, there's a lot more "wrong"

Ἔ

ἔρως•9/30/24, 12:37 AM

but when you finish this, i will tell you the rest

Ἔ

ἔρως•9/30/24, 12:37 AM

also, move the into the function

RaskinOP•9/30/24, 1:11 AM

Gonna take a 30 minute to hour break to reset my brain. Then I'm gonna tackle the MDN sites again and reformat the code.

Ἔ

ἔρως•9/30/24, 1:16 AM

take your time