JSFiddle - React, Tailwind, and code Playground

HTML

<select class="form-control" required name="article">
        <option value="Coca Cola">Coca Cola</option>
    </select>
    <input class="form-control number-input" value="" name="qty" type="text">

    
    <select class="form-control" required name="article">
        <option value="Jupi">Jupi</option>
    </select>  
    <input class="form-control number-input" value="" name="qty" type="text">

      
    <select class="form-control" required name="article">
        <option value="Fanta">Fanta</option>
    </select>
    <input class="form-control number-input" value="" name="qty" type="text">
        <div><button>update</button></div>
        <div id="output"></div>

JavaScript

$("button").click(function () {
    var invoiceNumber = 1;
    var articles = $('[name~=article]').map(function () {
        return $(this).val();
    }).get();
    var qty = $('[name~=qty]').map(function () {
        return $(this).val();
    }).get();
    
    var invoicesGet = [];
    for (var i in articles) {
        invoicesGet.push({
            invoice: invoiceNumber,
            article: articles[i],
            qty: qty[i]
        });
    }
    $("#output").text(JSON.stringify(invoicesGet));
});