JSFiddle - React, Tailwind, and code Playground

HTML

<head>
<script type="text/javascript" src="https://sandbox-assets.secure.checkout.visa.com/checkout-widget/resources/js/integration/v1/sdk.js"></script>
 <script src="https://sandbox-assets.secure.checkout.visa.com/checkout-widget/resources/js/integration/v1/sdk.js" type="text/javascript"></script>
    
</head>
<body>
<input type='number' id='log' class='cod' value='000.00' onchange="relervalor(this.value)"/>


<img alt="Visa Checkout" class="v-button" role="button"
src="https://secure.checkout.visa.com/wallet-services-web/xo/button.png"/>

<div id="output"></div>
<div id="log"></div>
<p id="demo"></p>

<script src="https://assets.secure.checkout.visa.com/checkout-widget/resources/js/integration/v1/sdk.js" type="text/javascript"></script>
</body>

CSS

input.cod {
    padding: 12px;
    vertical-align: top;
    width: 100px;
}

JavaScript

var x
x = document.getElementById("log").value;

relervalor = function(val){
		document.getElementById("demo").innerHTML = (val);
}


document.getElementById("demo").innerHTML = (x);

 function onVisaCheckoutReady (){
    V.init({ apikey: "D506KLKNE3TDYVKCWYGJ213vX0rL4n9UKPJk55F5GAL6Foxpc",
  paymentRequest:{
    currencyCode: "USD",
    subtotal: "33.00"
    
  }
  });
V.on("payment.success", function(payment)
  {alert(JSON.stringify(payment)); });
V.on("payment.cancel", function(payment)
  {alert(JSON.stringify(payment)); });
V.on("payment.error", function(payment, error)
  {alert(JSON.stringify(error)); });
}