My goal is to create a quiz that populates an array. Initially, the quiz is empty but I aim to assign it a default value.

This serves as my question navigation:

        /**
         *
         * @param {int} question
         * @returns {QuizPart}
         */
        SetQuestion(question) {

            if (this.questionNumber >= 0) {
                let oldAnswerButton = document.querySelectorAll('.filter_anwser');

                // Removes previous question when a new one is selected
                for (let answerButton of oldAnswerButton) {
                    answerButton.style.display = 'none';
                }
            }

            this.questionNumber = question;

            let q = this.quiz[question];
            // Checks if it's the last question to adjust button display
            if (this.questionNumber === Quiz.length - 1) {
                this.nextbtn.style.display = 'none';
                this.prevbtn.style.display = 'block';
                this.resultbtn.style.display = 'grid';
            } else if (this.questionNumber === 0) {
                this.nextbtn.style.display = 'block';
                this.prevbtn.style.display = 'none';
                this.resultbtn.style.display = 'none';
            } else {
                this.nextbtn.style.display = 'block;
                this.prevbtn.style.display = 'block;
                this.resultbtn.style.display = 'none';
            }

            // Shows Question
            this.questionName.textContent = q.questionText;
            this.questionName.id = "questionID";

            return q;
            console.log(this.getLink())
            console.log(this.tmp)

        }

        IntoArray() {
            const UrlVar = new URLSearchParams(this.getLink())
            this.UrlArray = [...UrlVar.entries()].map(([key, values]) => (
                    {[key]: values.split(",")}
                )
            );
        }

        NextQuestion() {
            let question = this.SetQuestion(this.questionNumber + 1);
            let pre = question.prefix;
            let prefixEqual = pre.replace('=', '');
            let UrlArr = this.UrlArray;
            let UrlKeys = UrlArr.flatMap(Object.keys)
            let answers = question.chosenAnswer.slice(0, -1);

            // Displays answers of the questions
            for (let y = 0; y < answers.length; y++) {
                let item = answers[y];

                // Display answer buttons
                if (UrlKeys.includes(prefixEqual)) {
                    console.log("exists");
                    let btn = document.querySelector('button[value="' + item.id + '"]');
                    btn.style.display = 'block';
                } else {
                    let btn = document.createElement('button');
                    btn.value = item.id;
                    btn.classList.add("filter_anwser", pre)
                    btn.id = 'answerbtn';
                    btn.textContent = item.name;
                    this.button.appendChild(btn);
                }
            }
            this.IntoArray();
        }

        PrevQuestion() {
            let question = this.SetQuestion(this.questionNumber - 1);
            let answers = question.chosenAnswer.slice(0, -1);

            // Displays answers of the questions
            for (let y = 0; y < answers.length; y++) {
                let item = answers[y];

                // Display answer buttons
                let btn = document.querySelector('button[value="' + item.id + '"]');
                btn.style.display = 'block';
            }
            this.IntoArray();
        }

Link builder and eventlistener:

        getLink() {
            this.tmp = [];
            for (let i = 0; i < this.url.length; i++) {
                // Check if question is from the same quiz part and add a comma between chosen answers and add the correct prefix at the beginning
                if (this.url[i].length > 0) {
                    this.tmp.push("" + Quiz[i].prefix + this.url[i].join(","))
                    // console.log(this.url)
                }
                    if (this.url[i].length === 0) {
                        this.tmp.push("");
                }
            }
            /// If answers are from different quiz parts add an ampersand between answers.
            return "" + this.tmp.join("&");
            // console.log(this.url[i].prefix);
        };

    control.button.addEventListener("click", function (e) {
        const tgt = e.target;

        // clear the url array if there's nothing clicked
        if (control.url.length === control.questionNumber) {
            control.url.push([]);
        }

        let quizUrl = control.url[control.questionNumber];

        // Check if a button is clicked. Changes color and adds value to the url array.
        if (quizUrl.indexOf(tgt.value) === -1) {
            if(quizUrl.includes("")){
                quizUrl.splice(quizUrl.indexOf(tgt.value), 1);
            }
            quizUrl.push(tgt.value);
            e.target.style.backgroundColor = "orange";
            // Check if a button is clicked again. If clicked again changes color back and deletes value in the url array.
        } else {
            quizUrl.splice(quizUrl.indexOf(tgt.value), 1);
            e.target.style.backgroundColor = "white";
        }

        console.log(control.getLink());
        console.log(quizUrl)

    })

When pressing a button, I add a value from an array to a separate array called url. The constructor definition looks like this:

this.url = ["","",""];

The array has three strings representing each question with a default value set. In the event listener, I implement an if statement to check for an empty string in the url and splice it out. However, I encounter an error message stating:

(index):329 Uncaught TypeError: quizUrl.splice is not a function at HTMLDivElement. ((index):329:25) (anonymous) @ (index):329

I require a default value so that I can skip answering all questions while still being able to proceed with the quiz. Can anyone suggest a solution to resolve this issue?