Hello, I've found a strange behaviour in a piece of my javascript application. Here I'm posting a minimal version of the problem.

When a user clicks on a specific div, the code asks that it should fire an event - an alert to simplify; in addition in intervals of 1 second the program updates the content of the divs (here it only checks the divs content and sees that there are no changes).
The problem is that, when the string "new match" is clicked, it should be called the function init_match(), but sometimes (about ~1/10) nothing occurs - i.e. the onclick event isn't fired, the other times everything goes well. This is very strange...

In a short code I can show that problem:

Code:
<html>

<head>
</head>

<body onload="loop()">
  <span id="init_panel" style="visibility:visible; position:absolute; left:0px; top:0px;"></span>

<script type="text/javascript">
function init_match(){
    alert("in init_match()");
    //...
  }
  var flag=true;
  function loop(){
    if (flag){
        var div = document.getElementById("init_panel");
        var HTML = "<div class='links' onclick='init_match();'><font color='black'><b>new match!</b></font></div><br />";
        if (div.innerHTML!=HTML){
            div.innerHTML=HTML;
        }
        setTimeout(loop, 1000);
    }
    else{
        div.innerHTML="";
    }
  }
  loop();
</script>

<style type="text/css">
  .links:hover{
    text-decoration: underline;
    cursor: pointer;
  }
</style>

</body>

</html>
This is really very strange! I don't know how to avoid this problem...
I want to update the links in intervals of 1 second, and that the links still work...

The corresponding jsfield is in:
http://jsfiddle.net/siluaty/grSDs/

Thank you in advance for any help or comment!