function addToList(num) {
var li = document.createElement('li'),
list = document.getElementById('primeList');
li.innerText = num;
list.appendChild(li);
}
function clearList() {
var list = document.getElementById('primeList');
list.innerHTML = '';
}
function primerize() {
clearList();
var numArray = [],
primeArray = [],
start = document.getElementById('primeStart').value !== null ? document.getElementById('primeStart').value : 0,
end = document.getElementById('primeEnd').value != null ? document.getElementById('primeEnd').value : 20;
for (var i = 0; i < end; i++) {
var divisArray = [];
numArray.push(i);
[].forEach.call(numArray, function (num) {
if (i % num === 0) {
divisArray.push(num)
}
});
if (i >= start && divisArray.length <= 2) {
primeArray.push(i);
addToList(i);
}
}
}
<input type="number" id="primeStart" placeholder="starting number">
<input type="number" id="primeEnd" placeholder="ending number" />
<button onclick="primerize();">get Primes</button>
<output id="result">
<ul id="primeList"></ul>
</output>
input:focus, button:focus{
outline: none;
border: 1px solid #1EBE28;
}
input {
padding: .618em;
border: 1px solid #ccc;
border-radius: 2px;
}
button {
color: white;
padding: .618em;
border: 1px solid #1EBE28;
border-radius: 3px;
background: rgb(30, 190, 40);
}
button:hover, button:focus{
background: rgb(25, 158, 33);
}
li{
color: #333;
font-size: 1.2em;
padding: 0;
line-height: 1.618
}