JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<div class="alojamiento-box">
    <div>Quantity:
        <input type="text" class="qty" />Unit price:
        <input type="text" class="unit" />Amount:
        <input type='text' class='amount-aloj' readonly />
    </div>
    <div>Quantity:
        <input type="text" class="qty" />Unit price:
        <input type="text" class="unit" />Amount:
        <input type='text' class='amount-aloj' readonly />
    </div>
    <div>Quantity:
        <input type="text" class="qty" />Unit price:
        <input type="text" class="unit" />Amount:
        <input type='text' class='amount-aloj' readonly />
    </div>Sub Total:
    <input type="text" class="alojamiento" readonly />
</div>
<div class="desplazamiento-box">
    <div>Quantity:
        <input type="text" class="qty" />Unit price:
        <input type="text" class="unit /">Amount:
        <input type='text' class='amount-desp' readonly />
    </div>
    <div>Quantity:
        <input type="text" class="qty" />Unit price:
        <input type="text" class="unit" />Amount:
        <input type='text' class='amount-desp' readonly />
    </div>
    <div>Quantity:
        <input type="text" class="qty" />Unit price:
        <input type="text" class="unit" />Amount:
        <input type='text' class='amount-desp' readonly />
    </div>Sub Total:
    <input type="text" class="desplazamiento" readonly />
</div><br />
Total All: <input type="text" class="total" readonly />

CSS

input {
  width: 70px;
}
.desplazamiento-box {
  margin: 3em 0 0 0;
}

JavaScript

function fnAlltotal() {
		var alojamiento_total = 0,
      	desplazamiento_total = 0;

    $(".amount-aloj").each(function(){
         alojamiento_total += parseFloat($(this).val()||0);
    });
    $(".amount-desp").each(function(){
         desplazamiento_total += parseFloat($(this).val()||0);
    });
    $(".alojamiento").val(alojamiento_total);
    $(".desplazamiento").val(desplazamiento_total);
  	$('.total').val((alojamiento_total + desplazamiento_total).toFixed(2));
		
}

$(".unit").on('keyup', function () {
    var self = $(this),
     		qtyVal = self.prev().val();

    self.next().val(qtyVal * self.val());
  fnAlltotal();
});

$(".qty").on('keyup', function () {
    var self = $(this),
        unitVal = self.next().val();
    self.next().next().val(unitVal * self.val());
   fnAlltotal();
});