## DEV Community # JS-Project for Beginners.

In this Project, we will generate a random number between 0 and 10, then tell the number if its even or odd. Then finally we'll add the numbers generated randomly.

# 1.HTML file

First create an html file and add the Title with `<h1>` tag then, `<h2>` tag which will contain our number, `<h2>` tag which will tell us that the number is even or odd. `<h2>` tag for title saying Total, finally a `<h2>` tag for number for counting our total number.
This is how it should look like

``````    <h1 class="gen">Random Number Generator</h1>
<h2 id="num">0</h2>
<h1 id="id">Unknown</h1>
<h1>Total</h1>
<h2 id="total">0</h2>
<button class="btn" onclick="random()">Generator</button>
<script src="index.js"></script>
``````

# 2.Random Number Generator.

Now we will create our JavaScript file.
First create a function and in it assign a variable num

``````function random() {
let num = Math.floor(Math.random() * 11);
}
``````

The `Math.random()` will generate numbers between 0.1 to 0.9, but we don't want that number so we will multiply them with 11 and round the numbers using `Math.floor()` .

Now add the code to change our inner text to randomly generated number just below the variable we assigned;

``````document.getElementById("num").innerText = num;
``````

When the function `random()` is called it will change our inner text to randomly generated number.

# 3.even() or odd()

Now for the second part tell if its even or odd.
first assign a variable `a` which will get our element form html

``````let a = document.getElementById("id");
``````

second create two functions within our function
named `even()` and `odd()` which will change our html inner text

``````  function odd() {
a.innerText = "Number is odd.";
}
function even() {
a.innerText = "Number is even.";
}
``````

Now add an if and else statement, if the number modulo 2 equals to zero then execute function `even()` if not then execute `odd()` .

``````if (num % 2 == 0)  {  // if the number is even
even();         // the even function will be called.
} else {  // if not
odd();          // then odd function will be called.
}
``````

The `%` in the code represents modulo

# 4.Total numbers

Now we can begin our final part.
First assign a variable above our `random()` function

``````let total = 0;
``````

Now add another variable in the `random()` function and assign it to get the element by its id `getElementbyId()`

``````let equl = document.getElementbyId("total");
``````

now we will add another variable which will add number randomly generated with the total variable that we declared above the `random()` function

``````let total = total + num;
``````

if you don't use the total variable like given above and use it like this :

``````sum = total + num;
``````

Then it will not work.
because total numbers are not adding to the total variable continuously.
we can also write it that another way :

``````let total += num;
``````

finally change the innerText of the html to the total variable

``````equl.innerText = total;
``````

Now you finall code should look like this :

``````let total = 0;

function random() {
let num = Math.floor(Math.random() * 11);
document.getElementById("num").innerText = num;

let a = document.getElementById("id");    // creating a variable to short the code. LOL.

function odd() {                          // if called this will change the text to "Number id odd".
a.innerText = "Number is odd.";
}
function even() {                         // if called this will change the text to "Number is even".
a.innerText = "Number is even.";
}

if (num % 2 == 0)  {  // if the number is even
even();         // the even function will be called.
} else {  // if not
odd();          // then odd function will be called.
}

let equl = document.getElementById("total");  // creating a variable to short the code. LOL.
total += num; // will add the previous value and number generated.
equl.innerText = total;       // this will change the inner text to the total amount
}

``````

I tried my best to make my-self clear if you don't understand then let me know in the comments.
Now lets test it. As you can see when i clicked the button it randomly generated our number, told us its even and added the number with our total number when i click the button again it again added the number to the total number and told us that number is odd.