Given code for the Water Park Planner JavaScript

main.js

var rhit = rhit || {};

rhit.WaterParkController = class {
	constructor() {
		const startingTicketsInput = document.querySelector("#startingTicketsInput");
		const updateBtn = document.querySelector("#updateButton");
		const btn1 = document.querySelector("#option1Button");
		const btn2 = document.querySelector("#option2Button");
		const btn3 = document.querySelector("#option3Button");
		const btn4 = document.querySelector("#option4Button");
		const resetBtn = document.querySelector("#resetButton");

		// Optionally you can use an array of button elements.
		const buttons = [btn1, btn2, btn3, btn4];

		// TODO: Add code to the constructor as needed
		

		// Note: You are REQUIRED to get the starting ticket value and the
		// costs for each activity from the HTML using tricks like .value on an element
		// or .dataset on elements.  You may NOT hardcode things like...
		//   this.startingTickets = 200;
		//   this.costs = [40, 15, 100, 20];
		// The above hardcode would lose points. You must show you can get those values
		// from the HTML.  They are already present in the given html, use JavaScript to
		// read those values from the appropriate HTML elements.



		this.updateView();
	}

	// TODO: Add methods as needed

	updateView() {
		const counterDisplay1 = document.querySelector("#option1Counter");
		const counterDisplay2 = document.querySelector("#option2Counter");
		const counterDisplay3 = document.querySelector("#option3Counter");
		const counterDisplay4 = document.querySelector("#option4Counter");
		const ticketsRemainingDisplay = document.querySelector("#ticketsRemaining");

		// Optionally you can use an array of text output elements.
		const counterDisplays = [counterDisplay1, counterDisplay2, counterDisplay3, counterDisplay4];

		// TODO: Add code to updateView as needed

	}
}

/* Main */
rhit.main = function () {
	console.log("Ready");
	new rhit.WaterParkController();
};

rhit.main();