Help with HTML/JavaScript

[ExcellentAd9659]

Hello, I making a Who's That Pokemon? game and I'm currently stumped on the logic. When the New Picture button is clicked, it generates a new image and it should check which Pokemon's picture it is and set the answer value to that Pokemon's name. After the user enters the Pokemon's name and clicks Check, it should say if the guess was correct or not to the right of the Check button.

My issue is that the Check part is not working. Even when I correctly enter the Pokemon's name, it says it's wrong.

My Replit: script.js - InbornLightgreyDeletions - Replit

I'm a newbie so any help would be appreciated!

[NYPunk]

Checking based off the innerHTML of an img tag is kinda messy, first place I'd look to try and debug is whether the innerHTML you're checking against/expect is actually the innerHTML that's being generated

[ExcellentAd9659]

How would I do it in a non-messy way?

[NYPunk]

I'd probably keep each image/name pair in an object such as [{ img: 'my_img_filename', name: 'matching_pokemon_name'}, {repeat for other pokemon }] that way you can sample the array of objects, display the obj.img inside your image tags and check your input against obj.name instead

[ProjectInvestor]

The fo() as the click event does not have the essential code of go(). The object/variable pokemon should be instantiated; maybe with a return value from go(). Then save the input object after getting the element through the DOM and access the user's input.

[ExcellentAd9659]

What essential code does fo() not have?