Clickes Counter issue with fadeout.

Clickes Counter issue with fadeout.

Hello,


  I have been strugling with this for the last 6 hours. Any help.
 there is some thing wrong with it but I don't know what is it, it works but not every time.

Here is the code sample :

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  var clicked = false;
  var missedclicked = 0;
 setInterval(function(){
    clicked = false;
    $("p").fadeIn(3000, function() {
       // Animation complete   
    });
    $("p").fadeOut(3000, function() {
       // Animation complete 
       if(!clicked){
        missedclicked = missedclicked + 1  ;
         alert("it is not clicked yet : " + clicked + ", you missed : " + missedclicked)  
       }    
    });
 },6000);
  $(".btn2").click(function(){
  clicked = true;
  });
});
</script>
</head>
<body>
<p style=" display : none;">This is a paragraph.</p>
<button class="btn2">click</button>
</body>
</html>