ARTICLE AD BOX
I am trying to change the text in my site based on the button that the user clicked. There is a total of 5 buttons. Here is my javascript:
const choices = document.getElementsByClassName("choices"); const title = document.querySelector(".mainInfo h2"); const paragraph = document.querySelector(".mainInfo p"); class aboutUs{ constructor(title, paragraph){ this.title = title; this.paragraph = paragraph; } } let history = new aboutUs("Our History", "As a company we thr"); let goals = new aboutUs("Our Goals", "Our goals are as follows"); let team = new aboutUs("Our Team", "Our Team consists of"); let values = new aboutUs("Our Values", "The values we protect here at 45 Degrees are"); let why = new aboutUs("Why", "The Why is one of our favorite things to talk about"); let arr = [history, goals, team, values, why] Array.from(choices).forEach(element =>{ element.onclick = function(){ console.log(element) // title.textContent = arr[element].title; // paragraph.textContent = arr[element].paragraph; } })I'm not sure how to continue after this, doing arr[element] obviously wont work because the element is not a number to be able to point to an index in the array, i thought there would be a built in function to maybe to check the position of that element relative to the parent but i couldnt find one. and is there a better way to go about this? i wanted to do it with the text in javascript and not to use classes like enable and disable visibility.
