如何在php和jquery中使用OOP

As the title says, how can I use oop with php and jquery. I create some objects at the php sides.

This is how they look:

class PurchaseOrder {
    private $id;
    private $credId;
    private $orderReference; 
    private $purchaseRows = array();

    /**
     * PurchaseOrder constructor.
     * @param $id
     * @param $credId
     * @param $orderReference
     */
    public function __construct($id, $credId, $orderReference)
    {
        $this->id = $id;
        $this->credId = $credId;
        $this->orderReference = $orderReference;
    }

    public function addPurchaseRow(PurchaseRow $row){
        array_push($this->purchaseRows, $row);
    }

    public function getPurchaseRow($index){
        return $this->purchaseRows[$index];
    }

    public function getOrderReference(){
        return $this->orderReference;
    }

}

And the purchase row is the same principle, the purchase row is just a order row. I create the objects and append them to the frontend.

Some portion of the html:

<table class="order-table">
   <thead>
      <tr>
        <th>Reference</th>
      </tr>
   </thead>
   <tbody>
     <?php
     echo "<tr> <td>" . $PurchaseOrder->getOrderReference . "</td> </tr>"
     ?>

  </tbody>
</table>

This works as expected. But now the part where I don't know how to do it. I I want to display the rows in a order when I click at a row at the table. I know the rows because they are in my object. But the object is gone at the frontend if I understand it correctly? So how can I retrieve the order rows from the PurchaseOrder object at the frontend?