Let's dive into controlling the times a while loop repeats its code, like this page that uses a loop to display several cameras.

<html>
<head>
<style>
body {
min-height: 440px;
text-align: center;
}
input {
height: 25px;
}
em, h3, #slider {
text-align: center;
}
</style>
</head>
<body>
<div style="display: inline-block; text-align: left;">
<em>Move the input element below</em>
<h3>Items per page: <span id="itemsPerPage"></span></h3>
<div id="slider" style="line-height: 25px;">1 <input min="1" max="10" oninput="generateList(this.value);" type="range" value="3"> 10</div>
<ol id="list">
</ol>
</div>
<script>
generateList(3);
function generateList(itemCount) { var itemsPerPage = document.getElementById("itemsPerPage"); itemsPerPage.innerHTML = itemCount; var list = document.getElementById("list"); list.innerHTML = ""; var counter = 1; while (counter <= itemCount) { var item = document.createElement("li"); item.innerHTML = '<img src="https://mimo.app/i/camera.png" height=25> Camera'; list.appendChild(item); counter++; } }
</script>
</body>
</html>]]>