I am coding a website that randomly selects one of three options and then puts a border around the input box that is selected. I have an alert so that I can see which one is actually selected and when it randomly selects one, it changes to two. I want it to select each of the three options evenly.
function onButtonClick() {
let num = Math.random();
if (num < 0.34) {
alert('Option 1');
document.getElementById(`one`).style.border = "dashed";
document.getElementById(`two`).style.border = "none";
document.getElementById(`three`).style.border = "none";
}
if (num <= 0.67) {
alert('Option 2');
document.getElementById(`one`).style.border = "none";
document.getElementById(`two`).style.border = "dashed";
document.getElementById(`three`).style.border = "none";
}
else {
alert('Option 3');
document.getElementById(`one`).style.border = "none";
document.getElementById(`two`).style.border = "none";
document.getElementById(`three`).style.border = "dashed";
}
}
button.addEventListener('click', onButtonClick);