Use jQuery to create invoice line calculating vat and total

I have been struggling with jQuery (I am new to it) I want to create an invoice page.

Page will have the following row of Text fields:

Quantity, Description, Net. Price, VAT price, Total Price.

When user starts filling in the Quantity, Description and when starts typing in Net. Price jQuery needs to add another row of empty text fields below.

--If user skips and fills in the VAT price without filling in the Net. price first jQuery needs to add another row below the existing one.

-- and If user skips Net price and VAT price and start filling Total price jQuery needs to add another row below the existing one.

Then comes the calculation:

when user fills in the Net. Price jQuery should automatically fill in the VAT price and also Total Price (which is Quantity + VAT Price)

When user fills in the VAT Price (skipping Net. Price) jQuery should automatically fill in the Net. Price and also Total Price (which is Quantity + VAT Price)

When user fills in the Total price (skipping Net. and VAT Price) jQuery should deduct it with Quantity and fill in the Net. Price and VAT price.

do you guys think you could help me?

I have this HTML code:

<div id='Invoice' class="row">
    <div class='InvoiceLine row'>
        <div class="ItemFields col-md-1"><input type="text" class="form-control" name="Quantity" id="Quantity"></div>
        <div class="ItemFields col-md-2"><input type="text" class="form-control" name="Description"></div>
        <div class="ItemFields col-md-1"><input type="text" class="form-control" name="NetPrice" id="NetPrice"></div>
        <div class="ItemFields col-md-1"><input type="text" class="form-control" name="VATPrice" id="VATPrice"></div>
        <div class="ItemFields col-md-1"><input type="text" class="form-control" name="TotalPrice" id="TotalPrice"></div>
    </div>
</div>

And I was working on this jQuery code to automatically add row of empty text fields

I managed to get it working. Just missing a small part.

I know I am killing the code but I will make it nicer, with functions and staff.

$('#Invoice').on("keyup", ".ItemFields", function() {

var LineNumber = parseInt( $(this).closest('#Invoice').children().last().attr('id') ) + 1

var InvoiceLine = '<div class="ItemFields col-md-1"><input type="text" class="form-control" name="Quantity_'+LineNumber+'" id="Quantity"></div><div class="ItemFields col-md-2"><input type="text" class="form-control" name="Description_'+LineNumber+'"></div><div class="ItemFields col-md-1"><input type="text" class="form-control" name="NetPrice_'+LineNumber+'" id="NetPrice"></div><div class="ItemFields col-md-1"><input type="text" class="form-control" name="VATPrice_'+LineNumber+'" id="VATPrice"></div><div class="ItemFields col-md-1"><input type="text" class="form-control" name="TotalPrice_'+LineNumber+'" id="TotalPrice"></div>';

if ( ($(this).closest('.InvoiceLine').find('#NetPrice').val() != "" || $(this).closest('.InvoiceLine').find('#VATPrice').val() != "" ) && $(this).closest('.InvoiceLine').attr('id') == $(this).closest('#Invoice').children().last().attr('id') ) {
    $('#Invoice .InvoiceLine').last().after('<div id="'+LineNumber+'" class="InvoiceLine row">'+InvoiceLine+'</div>')
    };
$(this).closest('.InvoiceLine').find('#VATPrice').val( ( 0.21 * parseInt($(this).closest('.InvoiceLine').find('#NetPrice').val()) ) +  parseInt($(this).closest('.InvoiceLine').find('#NetPrice').val()) );
$(this).closest('.InvoiceLine').find('#TotalPrice').val( parseInt($(this).closest('.InvoiceLine').find('#Quantity').val()) * parseInt($(this).closest('.InvoiceLine').find('#VATPrice').val()));

});