<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html>
<body>
<h2>Print the element Even or Odd</h2>
Eneter the value :
<input id="demo1" type=text><br><br>
<button id="btn" onclick="myMethod()">submit</button><br><br>
list of Odd number:<span id="demo2"></span><br><br>
List of Even Number :<span id="demo3"></span><br><br>
<script>
function myMethod(){
var x=document.getElementById("demo1").value;
var even="";
var odd="";
for(i=0;i<x;i++){
if(i%2==0){if(even==""){
even+=i;}else{
even+=","+i;
}
}
else{
if(odd=="")
{
odd+=i;
}
else{
odd+=","+i;
}
}
}
document.getElementById("demo2").innerHTML=odd;
document.getElementById("demo3").innerHTML=even;
//alert(x);
}
</script>
</body>
</html>