title: Javascript countdown timer only displays once?
body: <p>I have a web app which after 1 hour of inactivity brings up a JQuery UI modal dialog with a 5 minute countdown timer. The first time this happens the timer works fine but if the user extends session and it comes up a second time, the timer does not display (but is still accessible in the console and still counts down) </p>
  
  <p>Here is the code that runs when the popup is displayed:</p>
  
  <pre><code>// set countdown timer
  time=5*60,r=document.getElementById('r'),tmp=time;
  timer = setInterval(function(){
    var c=tmp--,m=(c/60)&gt;&gt;0,s=(c-m*60)+'';
    r.textContent='Time Remaining: '+m+':'+(s.length&gt;1?'':'0')+s  
    tmp!=0||(tmp=time);
  },1000);
  </code></pre>
  
  <p>Any ideas why it is not being displayed the second time?</p>
  
  <p>The markup for this part of the app is very simple. I am creating the modal in Javascript like this: </p>
  
  <pre><code>var modal = "&lt;div id='modal_pop'&gt;&lt;p&gt;"+opts.dialogText+"&lt;/p&gt;&lt;br&gt;&lt;br&gt;&lt;div id='r'&gt;&lt;/div&gt;&lt;/div&gt;";
  </code></pre>
  
  <p>And then each time the inactivity period is reached I am displaying it with the following code:</p>
  
  <pre><code>my_dialog = $(modal).dialog({
        buttons: buttonsOpts,
        modal: true,
        title: opts.dialogTitle
      });
  </code></pre>
  
  <p>Immediately after this I set up the timer using the first piece of code I submitted. Thanks for your help</p>