html - The javascript game timer does not reload -

i have been working on building javascript game called "light off" 1 bug not able fix when game on , user tries replay or go menu, timer not start again. have tried different methods.

//start game fiveminutes = 60 * .2; function start() {   $(document).ready(function() {     document.getelementbyid('menu').style.display = 'none';     document.getelementbyid('game').style.display = 'block';   });   score = 0;     if(fiveminutes == 60 * .2){         starttimer(fiveminutes);         genartor();         score();     }  } //=========================================================================================================================\\ //timer function starttimer(duration) {   var timer = duration,     minutes, seconds;   setinterval(function() {     minutes = parseint(timer / 60, 10)     seconds = parseint(timer % 60, 10);     if (--timer < 0) {         game_over();         return;     } else if (timer < 1.25) {       document.getelementbyid('onecount').style.display = 'block';     } else if (timer < 2.5) {       document.getelementbyid('twocount').style.display = 'block';     } else if (timer < 5) {       document.getelementbyid('three').style.display = 'block';     } else if (timer < 10) {       document.getelementbyid('four').style.display = 'block';     }   }, 1000); }  function loadtimer() {   document.getelementbyid('onecount').style.display = 'none';   document.getelementbyid('twocount').style.display = 'none';   document.getelementbyid('three').style.display = 'none';   document.getelementbyid('four').style.display = 'none';   starttimer(fiveminutes); } //=========================================================================================================================\\ // random switcher genartordisplay = document.queryselector('#time'); function genartor() {   var random = math.random();   if (random < 0.5) {     document.getelementbyid("one").style.backgroundcolor = "#01ff70";     document.getelementbyid("two").style.backgroundcolor = "#ff4136";     one_genartor = true;     two_genartor = false;   } else {     document.getelementbyid("two").style.backgroundcolor = "#01ff70";     document.getelementbyid("one").style.backgroundcolor = "#ff4136";     two_genartor = true;     one_genartor = false;   } } //=========================================================================================================================\\ //scoring sytstem score = 0;  function score() {   var update_score = document.getelementbyid('scoring');   update_score.innerhtml = "score: " + score;  } //=========================================================================================================================\\ //checking system function check_one() {   var 1 = true;   if (one == true && one_genartor == true) {     genartor();     score = score + 1;     score();       loadtimer();   } else if (one == true && one_genartor == false) {     game_over();   } }  function check_two() {   var 2 = true;   if (two == true && two_genartor == true) {     genartor();     score = score + 1;     score();     loadtimer();   } else if (two == true && two_genartor == false) {     game_over();   } } //=========================================================================================================================\\ //game on function var gameover = false; function game_over() { gameover = true;   $(document).ready(function() {     document.getelementbyid('game').style.display = 'none';     document.getelementbyid('game_over').style.display = 'block';   });   var end_score = document.getelementbyid('end_scoring');   end_score.innerhtml = "your score was: " + score;     fiveminutes = 60 * .2; }  function replay() {   $(document).ready(function() {     document.getelementbyid('game_over').style.display = 'none';     document.getelementbyid('game').style.display = 'block';     start();       gameover = false;   }); }  function menu() {   $(document).ready(function() {     document.getelementbyid('game_over').style.display = 'none';     document.getelementbyid('menu').style.display = 'block';       gameover =false;   }); } 

html

<html> <header>     <title>light out</title>      <link rel="stylesheet" type="text/css" href="index.css">     <link rel="shortcut icon" href="url.png" />     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">     <link rel="stylesheet" href="https://rawgit.com/daneden/animate.css/master/animate.css">      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">     </script>     <script src="index.js"></script>     <script src="https://dl.dropboxusercontent.com/u/42103336/web/wow.js"></script>     <script>     new wow().init();      </script>      </header>  <body>   <!-- menu-->   <div id="menu" class="fadein animated">     <h1>lights off</h1>     <button style="display:inline;" id="start" onclick="start();">start</button>      <p class="makers">wedde , stijn</p>        <!-- social media -->       <div class="wow bounce animated" data-wow-delay="1s">           <a href="www.facebook.com">       <span class="fa-stack fa-lg">           <i class="fa fa-circle fa-stack-2x"></i>           <i class="fa fa-facebook fa-stack-1x fa-inverse"></i>       </span>               </a>           <a href="www.twitter.com">       <span class="fa-stack fa-lg">           <i class="fa fa-circle fa-stack-2x"></i>           <i class="fa fa-twitter fa-stack-1x fa-inverse"></i>       </span>               </a>           <a href="www.instagram.com">       <span class="fa-stack fa-lg">           <i class="fa fa-circle fa-stack-2x"></i>           <i class="fa fa-instagram fa-stack-1x fa-inverse"></i>       </span>             </a>         </div>   </div>    <!-- game -->   <div id="game" style="display: none;">     <div id="scoring"></div>     <span id="time"></span>     <div style="display: none;" class="count-down" id="onecount"></div>     <div style="display: none;" class="count-down" id="twocount"></div>     <div style="display: none;" class="count-down" id="three"></div>     <div style="display: none;" class="count-down" id="four"></div>        <div id="one" onclick="check_one();"></div>     <div id="two" onclick="check_two();"></div>    </div>     <!-- stop -->   <div id="game_over" style="display: none;">     <h1>game over</h1>       <!--link mysql database -->      <div id="end_scoring"></div>     <button id="play_again" onclick="replay();"><i class="fa fa-repeat"></i> play again</button>     <button id="go_menu" onclick="menu();">go menu <i class="fa fa-home"></i></button>   </div> </html> 

try clear interval:

var intervalid = 0; function starttimer(duration) {   var timer = duration,     minutes, seconds;     intervalid = setinterval(function() {     minutes = parseint(timer / 60, 10)     seconds = parseint(timer % 60, 10);     if (--timer < 0) {         game_over();         clearinterval(intervalid);         return;     } else if (timer < 1.25) {       document.getelementbyid('onecount').style.display = 'block';     } else if (timer < 2.5) {       document.getelementbyid('twocount').style.display = 'block';     } else if (timer < 5) {       document.getelementbyid('three').style.display = 'block';     } else if (timer < 10) {       document.getelementbyid('four').style.display = 'block';     }   }, 1000); }