FizzBuzz test

by leethelobster

HTML

<h1>FizzBuzz</h1>
<p>
    Write a loop (in JavaScript) that counts from 1 to 100. If the number is a multiple of three, echo out the word "fizz". If the number is a multiple of five, echo out the word "buzz". If the number is a multiple of <strong>both</strong> three and five, echo out the word "fizzbuzz".
    <br /><br />
    Echo the resulting string in the #result div
</p>

<h1>Results</h1>
<div id="result"></div>

CSS

* {
    font-family: sans;
}

h1 {
    font-weight: bold;
    margin: 6px;
    border-bottom: 1px solid #ccc;
}

p {
    margin: 12px 6px;
}

JavaScript

var resultEl = document.getElementById('result');
//resultEl.innerHTML = 'No results';

// answer
for (var i=1; i<=100; i++) {
  if (i % 3 === 0) {
    if (i % 5 === 0) {
      resultEl.innerHTML += i+' fizzbuzz <br>';
    } else {
      resultEl.innerHTML += i+' fizz <br>';
    }
  } else if (i % 5 === 0) {
    resultEl.innerHTML += i+' buzz <br>';
  } else {
    resultEl.innerHTML += i+'<br>';
  }
}