I want to write a learning words game

I wanna write a learning game that words are seem in turn and we try know the meaning. I tried a lot of way but i could not…

document.addEventListener('click', getTarget);

function getTarget(e) {
    if (e.target.id === "start") {
        /*
<!-- <div class="questcheck d-flex justify-content-center align-items-center p-3 mb-2 bg-primary text-white" style="border: 1px solid black; background-color: green; width: 300px; height: 200px;">

                    <h1></h1>


                </div> -->
       */
        class words {

            constructor(name) {
                this.name = name;
            }
        }
        let words1 = new words("Protect");
        let words2 = new words("Coefficent");
        let words3 = new words("Inheritance");
        let words4 = new words("Externality");


        const div = document.querySelector('.words');


        var myArray;
        myArray = [words1, words2, words3, words3];



        for (var i; i <= myArray.length; i++) {

            div.innerHTML = myArray[i];

        }


    }








}

Hello,

I’d suggest taking a step back and getting some basic functionality to work. For example, are you able to write code that responds to a button click?

Like, if a user clicks a button can you make a message appear in the browser console?

Once you’re able to do that, try to print the same message on the page instead of in the console.

If you’re able to do those two things, then you are 75% of the way to your goal. The last step is to change the message to one of your words and put it into the blue box on the page.

The code you have it a bit confusing. It looks like you’re using functions and classes inside of functions, it seems unnecessarily complex. I’d encourage you to solve the problem in the simplest way possible before abstracting things away into functions.

2 Likes

I do not succeed , Thank you.