JSFiddle - React, Tailwind, and code Playground

by Luis Martin

HTML

<fieldset><legend>
Comparación
</legend>

<fieldset>

<legend>
Original
</legend> <br> Conversiones <input type="number" class="original" id="conversiones"> Sesiones <input type="number" class="original" id="sesiones"> % Conversión <input type="number" class="porcentaje" id="p_conversion" disabled>
</fieldset>
<br><br> 
<fieldset>

<legend>
Alternativa </legend><br> Conversiones <input class="alternativa" type="number" id="conversiones1"> Sesiones <input class="alternativa" type="number" id="sesiones1"> % Conversión <input type="number" class="porcentaje" id="p_conversion1" disabled>

</fieldset>
<br><br> % Mejora <input type="number" id="p_mejora" disabled>
</fieldset>

<br><br>
<fieldset>

<legend>Mejora</legend><br>
% Conversion original <input type="number" class="mejora" id="p_conversion2" >

% Conversion alternativa <input type="number" class="mejora" id="p_conversion3" >
<br><br>
%  mejora <input type="number"  id="p_mejora2" disabled></fieldset>

JavaScript

$(".original").change(function() {
  let conversiones = $("#conversiones").val();
  let sesiones = $("#sesiones").val()
  if (conversiones.length != 0 && sesiones.length != 0) {
    let p1 = (conversiones / sesiones) * 100
    $('#p_conversion').val(p1);
    updateMejora()
  }
})

$(".alternativa").change(function() {
  let conversiones = $("#conversiones1").val();
  let sesiones = $("#sesiones1").val()
  if (conversiones.length != 0 && sesiones.length != 0) {
    $('#p_conversion1').val((conversiones / sesiones) * 100);
    updateMejora()
  }
})

$(".porcentaje").change(updateMejora())

$('#mejora').click(updateMejora())


function updateMejora() {
  let p1 = $("#p_conversion").val();
  let p2 = $("#p_conversion1").val()
  if (p1.length != 0 && p2.length != 0) {
    $('#p_mejora').val(((p2 - p1) / p1) * 100);
  }
}


$(".mejora").change(function() {
  let p1 = $("#p_conversion2").val();
  let p2 = $("#p_conversion3").val()
  if (p1.length != 0 && p2.length != 0) {
    $('#p_mejora2').val(((p2 - p1) / p1) * 100);
  }
})