JSFiddle - React, Tailwind, and code Playground

HTML

<div class="distributions">
    <div class="form-item">
        <select id="" class="form-select" name="">
            <option value="distribution_1">Verdeelronde 1</option>
            <option value="distribution_2">Verdeelronde 2</option>
            <option value="distribution_3">Verdeelronde 3</option>
            <option value="distribution_4">Verdeelronde 4</option>
        </select>
    </div>
    <div id="distribution-amount-wrapper" class="form-item">
        <input type="text" class="form-text" value="" size="6" id="distribution-amount" name="distribution-amount-0"> <span class="field-suffix"><div class="order-arrow-holder">
                                  <div class="order-up"><a href="/marktplaats/bestellen/update/267878" class="order-update-button increase"></a></div>
                                  <div class="order-down"><a href="/marktplaats/bestellen/update/267878" class="order-update-button decrease"></a></div>
                                </div></span>

    </div>
</div><a class="add-promotion-distribution" href="/#">Voeg nog een levering toe</a>

JavaScript

var attrs = ['for', 'id', 'name'];
var attrs = ['name'];

function resetAttributeNames(section) {
    var tags = section.find('input, label'),
        idx = section.index();
    alert(idx);
    console.log(section);
    tags.each(function () {
        var $this = $(this);
        $.each(attrs, function (i, attr) {
            var attr_val = $this.attr(attr);
            if (attr_val) {
                $this.attr(attr, attr_val.replace(/-\d+$/, '-' + (idx + 1)))
            }
        })
    })
}

$('.add-promotion-distribution').click(function (e) {
    e.preventDefault();
    var lastRepeatingGroup = $('.distributions:last');
    var cloned = lastRepeatingGroup.clone(true);
    cloned.insertAfter(lastRepeatingGroup);
    alert(cloned.index());
    resetAttributeNames(cloned);
});