обратный отсчет столбца

Question

У меня зарегистрирован пользовательский тип записи, и я создал для него пользовательские столбцы. Один из этих столбцов ведет обратный отсчет - это функция, позволяющая вырезать NowTime из настраиваемой мета-даты и времени, которые я предварительно установил, чтобы я работал через javascript ихорошо, но он получает только одно значение для всех строк, вот мой код:

это зарегистрированный столбец

case 'reminder':
    $reminder = remider_text();

    break;

это функция с JavaScript

function remider_text(){
$date = get_post_meta($post_id, 'booking_date', true);
$date_format = "M d, Y";
$meta = (!empty($date)) ? date($date_format, $date) : "";
$time = get_post_meta($post_id, 'time', true);
$data = $meta ." ". $time;

if ($data == '') {
echo 'N/A';
?>
<?php
} else { ?>
              <div id="countdown"></div>

<script>
console.log(data)
// Set the date we're counting down to
var countDownDate = new Date(data).getTime();

// Update the count down every 1 second
var x = setInterval(function() {

// Get todays date and time
var now = new Date().getTime();

// Find the distance between now and the count down date
var distance = countDownDate - now;

// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 
* 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);

// Output the result in an element with id="demo"
var elms = document.querySelectorAll("[id='countdown']");
for(var i = 0; i < elms.length; i++) 
elms[i].innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";

// Changing text color
var elms_color = document.querySelectorAll("[id='countdown']");
for(var i = 0; i < elms_color.length; i++) 
elms_color[i].style.color = days === 0 && hours < 3 ? 'red' : '';

 // Changing text color
 var elms_color = document.querySelectorAll("[id='countdown']");
for(var i = 0; i < elms_color.length; i++) 
elms_color[i].style.color = days === 2 && hours < 5 ? 'orange' : '';

// If the count down is over, write some text 
if (distance < 0) {
    clearInterval(x);
    for(var i = 0; i < elms.length; i++) 
    elms[i].innerHTML = "Outdated";
}
}, 1000);
</script>
  <?php }
 ?>
<?php}

Здесь приведены мета-значения даты и времени

Aug 13, 2019 14:00
Oct 27, 2018 14:00
Oct 19, 2018 14:00
Oct 13, 2018 13:00
Oct 25, 2019 14:00
Oct 08, 2018 07:00

Я тоже пробовал это, но я снова получил только одно значение

function remider_text()
{
$date = get_post_meta($post_id, 'booking_date', true);
$date_format = "M d, Y";
$meta = (!empty($date)) ? date($date_format, $date) : "";
$time = get_post_meta($post_id, 'time', true);
$data = $meta . " " . $time;

if ($data == '') {
    echo 'N/A';
    ?>
    <?php
} else {
    $temp2 = $data;
    $test = $i . 'test';
    $i++;
    ?>
    <div id="<?php print $test;?>"></div>

    <script type="text/javascript">

      dateFuture1 = new Date(<?php print $temp2;?>);

      function GetCount(ddate,iid){
      console.log(data)

      dateNow = new Date(); //grab current date
    amount = ddate.getTime() - dateNow.getTime();   //calc milliseconds 
      between dates
    delete dateNow;


    // if time is already past
    if(amount < 0){
      document.getElementById(iid).innerHTML="Now!";
    }
    // else date is still good
    else{
      mins=0;secs=0;out="";

      amount = Math.floor(amount/1000);//kill the "milliseconds" so 
        just secs

      mins=Math.floor(amount/60);//minutes
      amount=amount%60;

      secs=Math.floor(amount);//seconds

      if(mins != 0){out += (mins<=9?'0':'')+mins +" "+ 
      ((mins==1)?"mins":"mins")+", ";}
      if(secs != 0){out += (secs<=9?'0':'')+secs +" "+ 
      ((secs==1)?"secs":"secs")+", ";}
      out = out.substr(0,out.length-2);
      document.getElementById(iid).innerHTML=out;

      setTimeout(function(){GetCount(ddate,iid)}, 1000);
      }
      }
      window.onload=function(){
    GetCount(dateFuture1, '<?php print $test;?>');
      };
    </script>
            <?php }
      ?>
      <?php }