Streaming live at 10am (PST)

Add dynamic form elements with custom code

Hi, I have created a form in which I have buttons that add new div blocks with elements inside… The dynamic div’s are added well, but I need a new number placed before every “data name” of the children elements (input fields, text areas etc.) in order to receive all the info from the form. Can someone help me with the code? This is the code I used:

  $(document).ready(function () {
    var index = 0;
    $(document).on("click", "#add", function () {
        var html = $("#new_item_block").html();
        $new = $("#order_wrapper").append("<div id='item" + (++index) + "' " + html + "</div>");
    });
    $(document).on("click", "#add2", function () {
        var html = $("#new_item_block2").html();
        $new = $("#order_wrapper").append("<div id='item" + (++index) + "' " + html + "</div>");
    });
    $(document).on("click", "#add3", function () {
        var html = $("#new_item_block3").html();
        $new = $("#order_wrapper").append("<div id='item" + (++index) + "' " + html + "</div>");
    });
    $(document).on("click", ".delete", function(e) {
    e.preventDefault();
    $(this).parent('div').remove();
    });
});

Website: https://altom.webflow.io/en/selfadhesive-printed-tapes

Thanks.