How do I make an ajax call perform a function only once

Basically, I am implementing a food status tracking for an order based on orderNo. I refresh the page every 60 seconds, to append the new status in my div. However, for the start as the order is placed, I have a 'waiting' status. I don't want the same status to get appended to my div every 60s before the status is changed by the admin. How do I achieve that? Also, is it possible to have the appended statuses if I open the page after a while? For instance, if status='Preparation', I want to have 'Waiting', 'Confirmed' to appear whenever I open the page. Thanks

<script>
jQuery($ => {
  var orderNo = "<?php echo $orderNo; ?>";

  function getData() {
    $.ajax({
      url: 'action.php',
      method: 'post',
      data: {
        orderNo: orderNo
      },
      success: function(response) {
        $("#progressbar").append(response);
        setTimeout(getData, 60000); // repeat in 60 secs, if AJAX was successful
      }
    });
  }

  getData(); // on load
 });

</script>

In my action.php file

//ORDER PROGRESS
if (isset($_POST['orderNo']))
{


    $orderNo=$_POST['orderNo'];

    $orderSt="SELECT O_Status from orders WHERE O_No='$orderNo'";

    $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $orderRes=$conn->query($orderSt);

     $orderRow=$orderRes->fetch(PDO::FETCH_ASSOC);
     $orderStatus=$orderRow['O_Status'];


     if ($orderStatus=='Waiting')
     {
        echo "<div style='height:200px; width:200px; text-align: center'>
                <img style='height:150px; width:150px' src='foodStatusImages/Waiting.png'>
                  <h6>WAITING FOR CONFIRMATION</h6>
              </div>";


     }

}