JSFiddle - React, Tailwind, and code Playground

by bornasepic

HTML

<!DOCTYPE html>


<title>Prime Number</title>

<script src="script.js"></script>


<body>
  <input class="inputfield" type="number" name="number" min="1">
  <input class="submitfield" type="button" name="isit?" value="Is this number prime?">
  <p class="result">This is where the result goes</p>

</body>

CSS

body{
  width: 960px;
  margin: auto;
  margin-top: 20px;
  font-family: sans-serif;
  font-size: 16px;
}

JavaScript

function ready(fn) {
  if (document.attachEvent ? document.readyState === 'complete' : document.readyState !== 'loading') {
    fn();
  } else {
    document.addEventListener('DOMContentLoaded', fn);
  }
}

function prime() {
  var result = document.querySelector(".result");
  var g = document.querySelector(".inputfield").value; /*number*/
  var x = Number(g);
  var y = 2;
  var primenumber = true;
  for (var y = 2; y <= 9, y != x; y++) {
    if (x % y === 0) {
      primenumber = false;
      result.innerHTML = "Number is not prime"; {
        break
      };
    }
    if (x % y !== 0) {
      result.innerHTML = "Number is prime";
    }
    if (x == 1) {
      result.innerHTML = "Number is prime";
    }
  }
}



ready(function() {
  var start = document.querySelector(".submitfield");
  start.addEventListener("click", prime);
});