Countdown timer in a foreach() loop
<p>I have the following code:</p>

<pre><code>&lt;script&gt;
    var interval;
    var minutes = 0;
    var seconds = 5;

   function countdown(element) {
        interval = setInterval(function() {
            var el = document.getElementById(element);
            if(seconds == 0) {
                if(minutes == 0) {
                    el.innerHTML = "&lt;a href=http://www.parkho.ir/phpvms/admin/index.php/aircraftmanager/update&gt;Hello&lt;/a&gt;";                    
                    clearInterval(interval);
                    return;
                } else {
                    minutes--;
                    seconds = 60;
                }
            }
            if(minutes &gt; 0) {
                var minute_text = minutes + (minutes &gt; 1 ? ' minutes' : ' minute');
            } else {
                var minute_text = '';
            }
            var second_text = seconds &gt; 1 ? 'seconds' : 'second';
            el.innerHTML = minute_text + ' ' + seconds + ' ' + second_text + ' remaining';
            seconds--;
        }, 1000);
    }
    &lt;/script&gt;
&lt;h3&gt;&lt;?php echo $title ;?&gt;&lt;/h3&gt;
&lt;head&gt;
    &lt;link rel="stylesheet" href="./css/style.css" type="text/css" /&gt;
    &lt;script type="text/javascript" src="&lt;?php echo fileurl('lib/js/jquery-1.3.1.min.js');?&gt;"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="&lt;?php echo fileurl('lib/js/jquery.tablesorter.js');?&gt;"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="&lt;?php echo fileurl('lib/js/jquery.tablesorter.pager1.js');?&gt;"&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div align="left" id="pager" class="pager"&gt;
    &lt;table width="50%" align="center"&gt;
    &lt;form&gt;
        &lt;tr&gt;
            &lt;td align="center"&gt;&lt;img src="&lt;?php echo fileurl('lib/images/first.png');?&gt;" class="first"/&gt;
            &lt;img src="&lt;?php echo fileurl('lib/images/prev.png');?&gt;" class="prev"/&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;input width="5" valign="top" type="text" class="pagedisplay"/&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;img src="&lt;?php echo fileurl('lib/images/next.png');?&gt;" class="next"/&gt;
            &lt;img src="&lt;?php echo fileurl('lib/images/last.png');?&gt;" class="last"/&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;select class="pagesize"&gt;
                                &lt;option value="10"&gt;5 per page&lt;/option&gt;
                                &lt;option value="20"&gt;10 per page&lt;/option&gt;         
                                &lt;option value="50"&gt;25 per page&lt;/option&gt;         
                               &lt;/select&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
    &lt;/form&gt;
    &lt;/table&gt;
&lt;/div&gt;
&lt;script defer="defer"&gt;
    $(document).ready(function() 
    { 
        $("#insured_list")
        .tablesorter({widthFixed: true, widgets: ['zebra']})
        .tablesorterPager({container: $("#pager")}); 
    } 
    ); 
&lt;/script&gt;
&lt;table id="insured_list" align="center" border="1" width="100%" cellpadding="0" cellspacing="0"&gt;
&lt;thead&gt;
    &lt;th align="center" colspan="10"&gt;&lt;font color="black" size="6"&gt;&lt;b&gt;Aircraft Manager&lt;/b&gt;&lt;/font&gt;&lt;/th&gt;
        &lt;tr&gt;
            &lt;td align="left" colspan="0"&gt;&lt;a href="&lt;?php echo adminurl('/aircraftmanager/allac?available=0') ;?&gt;"&gt;&lt;input type="button" value="Inactive All Aircraft"&gt;&lt;/a&gt;&lt;/td&gt;
            &lt;td align="left" colspan="0"&gt;&lt;a href="&lt;?php echo adminurl('/aircraftmanager/allac?available=1') ;?&gt;"&gt;&lt;input type="button" value="Active All Aircraft"&gt;&lt;/a&gt;&lt;/td&gt;
            &lt;td align="left" colspan="0"&gt;&lt;a href="&lt;?php echo adminurl('/aircraftmanager/update') ;?&gt;"&gt;&lt;input type="button" value="Update Status"&gt;&lt;/a&gt;&lt;/td&gt;
            &lt;td align="left" colspan="0"&gt;&lt;a href="&lt;?php echo adminurl('/aircraftmanager/status?available=100') ;?&gt;"&gt;&lt;input type="button" value="Reset Status"&gt;&lt;/a&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td align="center"&gt;&lt;b&gt;ID&lt;/b&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;b&gt;Name&lt;/b&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;b&gt;Registration&lt;/b&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;b&gt;Location&lt;/b&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;b&gt;Status&lt;/b&gt;&lt;/td&gt; 
            &lt;td align="center"&gt;&lt;b&gt;Time&lt;/b&gt;&lt;/td&gt; 
            &lt;td align="center" colspan="2"&gt;&lt;b&gt;Options&lt;/b&gt;&lt;/td&gt;          
        &lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody)
&lt;?php
$i=0;
foreach($aircrafts as $aircraft)
{
$air = AManagerData::getaircraftdetail($aircraft-&gt;id);
?&gt;
    &lt;tr&gt;
            &lt;td align="center"&gt;&lt;?php echo $aircraft-&gt;id ;?&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;?php echo $aircraft-&gt;fullname ;?&gt;&lt;/td&gt;
            &lt;td align="center"&gt;&lt;?php echo $aircraft-&gt;registration ;?&gt;&lt;/td&gt;
            &lt;td align="center"&gt;
            &lt;?php 
            $location = AManagerData::getaircraftlocation($aircraft-&gt;id);
            echo $location-&gt;arricao;
            ?&gt;
            &lt;/td&gt;
            &lt;td align="center"&gt;
            &lt;?php
            $param = AManagerData::getaircraftparam($aircraft-&gt;id);
            $stat = $param-&gt;start;
            echo $stat.'%';
            ?&gt;
            &lt;/td&gt;
            &lt;td align="center"&gt;
            &lt;div id='countdown'&gt;&lt;/div&gt;
            &lt;/td&gt;           
            &lt;td align="center"&gt;
            &lt;a class="{button:{icons:{primary:'ui-icon-arrowthick-1-s'}}}" href="#" onclick="$('#details_dialog_&lt;?php echo $aircraft-&gt;id;?&gt;').toggle()"&gt;&lt;input type="button" Value="Parameters"&gt;&lt;/a&gt;
            &lt;/form&gt;
            &lt;/td&gt;
            &lt;td align="center"&gt;
            &lt;?php
            if(PilotGroups::group_has_perm(Auth::$usergroups, FULL_ADMIN)) 
                {
                    $pilotid = $pilot-&gt;pilotid;
            ?&gt;
            &lt;form id="deletepilot" method="get" action="&lt;?php echo adminurl('/pilotmanager/deletePilot');?&gt;"&gt;
            &lt;input type="hidden" name="pilotid" value="&lt;?php echo $pilotid ;?&gt;" /&gt;
            &lt;input type="submit" name="submit" value="Delete" onclick="return doublecheck()" ;?&gt;
            &lt;/form&gt;
            &lt;?php
                }
            ?&gt;
            &lt;/td&gt;

        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td colspan="10"&gt;
                &lt;form action="&lt;?php echo adminaction('/aircraftmanager/param');?&gt;" method="GET"&gt;
                &lt;table align="center" border="0" id="details_dialog_&lt;?php echo $aircraft-&gt;id;?&gt;" style="display:none"  width="100%"&gt;
                    &lt;tr&gt;
                        &lt;th align="center" bgcolor="black" colspan="0"&gt;&lt;font color="white"&gt;Aircraft Parameter Setting&lt;/font&gt;&lt;/th&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;b&gt;&amp;nbsp;Start:&lt;/b&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="radio" name="perstart" value="100" checked="checked" &gt;100%
                        &lt;input type="radio" name="perstart" value="75" &gt;75%
                        &lt;input type="radio" name="perstart" value="50" &gt;50%&lt;/td&gt;

                        &lt;td&gt;&lt;b&gt;&amp;nbsp;Hard Landing:&lt;/b&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="radio" name="perhard" value="30" checked="checked" &gt;30%
                        &lt;input type="radio" name="perhard" value="20" &gt;20%
                        &lt;input type="radio" name="perhard" value="15" &gt;15%&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;b&gt;&amp;nbsp;Smooth Landing:&lt;/b&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="radio" name="persoft" value="2" checked="checked" &gt;2%
                        &lt;input type="radio" name="persoft" value="4" &gt;4%
                        &lt;input type="radio" name="persoft" value="10" &gt;10%&lt;/td&gt;

                        &lt;td&gt;&lt;b&gt;&amp;nbsp;Before Inactivity:&lt;/b&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="radio" name="perhour" value="800" checked="checked" &gt;800 hrs
                        &lt;input type="radio" name="perhour" value="600" &gt;600 hrs
                        &lt;input type="radio" name="perhour" value="400" &gt;400 hrs&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;b&gt;&amp;nbsp;Maintenance Period:&lt;/b&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="radio" name="mhours" value="12" checked="checked" &gt;12 hrs
                        &lt;input type="radio" name="mhours" value="24" &gt;24 hrs
                        &lt;input type="radio" name="mhours" value="36" &gt;36 hrs&lt;/td&gt;

                        &lt;td&gt;&lt;b&gt;&amp;nbsp;Maximum Landing Rate:&lt;/b&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="radio" name="maxlr" value="-600" checked="checked" &gt;600 ft/m
                        &lt;input type="radio" name="maxlr" value="-450" &gt;450 ft/m
                        &lt;input type="radio" name="maxlr" value="-300" &gt;300 ft/m&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;&lt;td colspan="4"&gt;&lt;hr&gt;&lt;/td&gt;&lt;/tr&gt;
                    &lt;tr&gt;
                    &lt;td colspan="0" align="center"&gt;&lt;input type="hidden" name ="aircraft" value="&lt;?php echo $aircraft-&gt;id ;?&gt;"&gt;&lt;input type="submit" value="Apply Settings"&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                &lt;/table&gt;
                &lt;/form&gt;
            &lt;/td&gt;
        &lt;/tr&gt;

&lt;?php
}

?&gt;

&lt;script type="text/javascript"&gt;
function doublecheck()
{
    var answer = confirm("Are you sure you want to delete the aircraft?")
    if (answer) {
        return true;
    }

    return false;
}
&lt;/script&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;/body&gt;
</code></pre>

<p>What I'm trying to do is to show a countdown timer in the foreach() loop but only the first record shows the timer and the rest will show blank.
This is the line where I show the timer:</p>

<pre><code>&lt;td align="center"&gt;
            &lt;div id='countdown'&gt;&lt;/div&gt;
            &lt;/td&gt;           
</code></pre>

<p>Please tell me where I'm wrong or if it's doable this way.
Thanks  </p>
