Just embarked on my first JavaScript project and I'm aiming to create a personalized slot machine. However, I've hit a roadblock - I can't figure out how to restart my program or the function for generating new random values repeatedly. Here's what my code looks like so far:
var randomX1 = Math.ceil(Math.random() * 10 );
var randomX2 = Math.ceil(Math.random() * 10 );
var randomX3 = Math.ceil(Math.random() * 10 );
function randomClickX() {
document.getElementById("randomX1").innerHTML = randomX1;
document.getElementById("randomX2").innerHTML = randomX2;
document.getElementById("randomX3").innerHTML = randomX3;
var output = "Play again";
if (randomX1 === randomX2) {
if(randomX2 === randomX3) {
var output = "Jackpot";
}
}
var result = output;
function clickResult() {
document.getElementById("result").innerHTML = result;
}
document.getElementById('spanId').innerHTML = result;
};
.slot-container {
border: 5px solid red;
vertical-align: middle;
font-size: 50px;
font-family: Leelawadee UI Semilight, Calibri, Arial;
width: 90%;
margin: auto;
height: 0;
padding-bottom: 30%;
}
(remaining CSS and HTML code remains as is)
I currently have to refresh the HTML file in order to click the SPIN button again and generate new random numbers. I believe the key lies in creating a comprehensive function that is called at the end of the SPIN function. I just need some guidance on how to implement this successfully. Any help would be greatly appreciated!
Regards, Jonas