JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="container">
  <div class="row" id="cart">
    <h1>Cart Page</h1>
    <table class="cart-table">
      <thead>
        <tr>
          <td>Item</td>
          <td>Price</td>
        </tr>
      </thead>
      <tbody class="cart-body"></tbody>
    </table>
  </div>
  <div class="row" id="total">
    <h1>Total page</h1>
    <table class="cart-table">
      <thead>
        <tr>
          <td>Item</td>
          <td>Price</td>
        </tr>
      </thead>
      <tbody class="cart-body"></tbody>
    </table>
  </div>
</div>

CSS

.cart-table {
  border: 1px solid black
}

JavaScript

cart = []
cart_body = $(".cart-body")

function addItem(name, price) {
  item = {}
	item.name = name
	item.price = price  
  item.row = $("<tr class='item-row' data-name='"+name+"' data-price='"+price+"'><td class='name'>" + name + "</td><td class='price'>" + price + "</td></tr>")
  cart.push(item)
  addToUI(item.row)
}

function addToUI(item_row) {
  cart_body.append(item_row)
}

function removeItem(name,price) {
  var length = cart.length
	for (var i = 0; i < length; i++ ) {
    if (cart[i].name == name && cart[i].price == price) { 
    	item_whose_row_to_remove = cart[i]
      cart.splice(i,1)
      break
    }
  }
	removeFromUI(item_whose_row_to_remove)
}

function removeFromUI(item) {
  // item.row.remove()
  cart_body.find(".item-row[data-name='"+item.name+"'][data-price='"+item.price+"']").remove()
}

function changeItemPrice(name,new_price) {
  var length = cart.length
	for (var i = 0; i < length; i++ ) {
    if (cart[i].name == name) { 
      old_price = cart[i].price
			cart[i].price = new_price
      item_whose_price_to_update = cart[i]
      break
    }
  }
	changePriceInUI(item_whose_price_to_update, old_price)
}

function changePriceInUI(item, old_price) {
  // item.row.find(".price").empty().append(item.price)
  cart_body.find(".item-row[data-name='"+item.name+"'][data-price='"+old_price+"']").find(".price").empty().append(item.price)
}


addItem("Ball", 1)
addItem("Stick",2)
removeItem("Ball",1)
changeItemPrice("Stick",3)