I am currently working on developing a JavaScript calculator program.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8>
<script type="text/javascript>
var buttons = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "+", "-", "*", "/", "C", "Enter"];
</script>
</head>
<body>
<script type="text/javascript>
var n = 0;
for (var i = 0; i < buttons.length; i++) {
document.write("<button>" + buttons[i] + "</button>");
if (i === 3 * n) {
document.write("<button>" + buttons[i] + "</button><br>");
n++;
}
}
</script>
</body>
</html>When the output is displayed, it should look something like this:
1 2 3 4
5 6 7 8
9 0 + -
- / C Enter
However, I am experiencing some issues with my current output:
1 2 4
5 7
8 0
- *
/ Enter
I am trying to figure out why there are missing buttons such as 3, 6, 9, -, and C. My goal is to create a new line every time the for loop reaches indexes that are multiples of 3 (which means a new line after button 4, 8, etc.).