multiple succes funtion in ajax

I am using a Ajax script to get data from my database and post it into multiple textboxes. After posting the data I also want to calculate with the textboxes. When I run the script I see that the script runs all the calculations at the same time. Does someone know how I can build multiple onSuccess functions in my script so the script executes the codes in the right order?

Here is my script:

$(document).on('change', '[id^=vat1]', function getVat12() { // Do an Ajax request to retrieve the product price 
console.log("getVat2 before ajax", jQuery('#vat1').val());
jQuery.ajax({ 
url: './get/get2.php', 
method: 'POST', 
data: {'id' : $('#vat1').val()},
success: function(response){ 
// and put the price in text field 
console.log("getPrice after ajax", jQuery('#vat1').val());
jQuery('#percentage1').val(response);

// code 1   
var numVal1 = Number(document.getElementById('quantity1').value);
var numVal2 = Number(document.getElementById('price_ex1').value);
var totalValue1 = numVal1 * numVal2
document.getElementById('totalprice1').value = totalValue1.toFixed(2);

//code 2
var numVal3 = Number(document.getElementById('totalprice1').value); 
var totalValue2 = numVal3;
document.getElementById('subtotal').value = totalValue2.toFixed(2);

//code 3
var numVal4 = Number(document.getElementById('totalprice1').value);
var numVal5 = Number(document.getElementById('percentage1').value);
var totalValue3 = numVal4 / 100 * numVal5
document.getElementById('vat2').value = totalValue3.toFixed(2);

}, 
error: function (request, status, error) { 
alert(request.responseText); 
}, 
}); 

});

from multiple succes funtion in ajax