Paypal smart button integration side by side

I have trouble with this Paypal smart buttons. Even it it looks simple as I imagine :) can't get it to work.

I have three items, side by side in separate divs and want to add paypal smart buttons under each item but only different price.

When I put this paypal code under first, it is working like a charm.

<div id="paypal-button-container"></div>
<!-- <script src="https://www.paypal.com/sdk/js?client-id=sb&currency=EUR" data-sdk-integration-source="button-factory"></script> -->
<script src="https://www.paypal.com/sdk/js?client-id=ARcbGj17hMo1yw4nEMDB5E-Y7W00gbie9F_zb0m--XCOjKWo4jIddFV9N5UzbluK-if61HLUVs0rQ7zC&currency=EUR" data-sdk-integration-source="button-factory"></script>
<script>
  paypal.Buttons({
      style: {
          shape: 'pill',
          color: 'gold',
          layout: 'vertical',
          label: 'pay',
          
      },
      createOrder: function(data, actions) {
          return actions.order.create({
              purchase_units: [{
                  amount: {
                      value: '13.88'
                  }
              }]
          });
      },
      onApprove: function(data, actions) {
          return actions.order.capture().then(function(details) {
              alert('Transaction completed by ' + details.payer.name.given_name + '!');
              window.open('www.google.ba');
          });
      }
  }).render('#paypal-button-container');
</script>

But when I put same code with changed money value it only shows that second one, and also when I put under third item it shows only that one.

I tried to render.('#custompaypalbutton') - to change class of button div where it shows up but nothing changed.

Am I missing something?

Do I maybe need different paypal app (REST Api) for every button that will generate new ID?

Solution

<script src="https://www.paypal.com/sdk/js... must only be loaded once per page
Each button should .render('...') to its own container element