JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <span>Price1</span><input id="price1" type="text"/>
 </div>
   <br>
<div>
    <span>Price2</span><input id="price2" type="text"/></div>
    <br>
        <div><span>Rate</span><input id="rate" type="text" style="width:50px"/>%</div>
        <p>Write down two numbers, then change the Rate number</p>

CSS

span{width:50px; display:inline-block}
input{margin-right:3px;}

JavaScript

$(document).ready(function(){
$("#price1, #price2").keyup(function() {
  var priceOne = parseFloat($("#price1").val());
  var priceTwo = parseFloat($("#price2").val());
  var rate = parseFloat($("#rate").val());
  if ($("#price1").val() && $("#price2").val()){     
  $('#rate').val(((priceTwo - priceOne) / priceOne * 100).toFixed(2));
}
  
});

$("#rate").keyup(function() {
  var priceOne = parseFloat($("#price1").val());
  var rate = parseFloat($("#rate").val());
    
   if ($("#rate").val() && $("#price1").val() && $("#price2").val()){
 $('#price2').val(((priceOne * rate)/ 100 + priceOne).toFixed(2));
}
});
})