How to clone a div with dynamic values [duplicate]

i have a set of li that dynamically adding to page with jQuery draggable
every things work fine, now i added duplicate icon and onclick have clone my div:

   $(document).on('click', '.copy-question', function() {
                var newId = 123;
                var element = $(this).closest('li.FormItem');
                var newElement = element.clone();
                element.after(newElement);
    });

li content is:

<li class="FormItem text-field" data-id="sorting" data-me="1722453902890" type="text">
    <div class="field-actions">
        <a type="edit" class="toggle-form btn formbuilder-icon-pencil copy-question" data-id="1722453902890"
            title="duplicate">duplicate</a>
        <a type="remove" class="del-button btn formbuilder-icon-cancel delete-question" title="x">X</a>
    </div>
    <label class="field-label handle toplabel">(سورتینگ)</label>
    <span class="tooltip-element" style="display: none">?</span>
    <div class="frm-holder">
        <div class="form-elements">
            <input type="hidden" name="question[1722453902890][Qtype]" value="sorting" />
            <div class="form-group placeholder-wrap" style="display: block">
                <label>title</label>
                <div class="input-wrap">
                    <input name="question[1722453902890][label]" class="fld-label form-control" value="title"
                        type="text" />
                </div>
            </div>
            <div class="form-group name-wrap" style="display: block">
                <label>options</label>
                <div class="input-wrap">
                    <div class="sortable-options-wrap" style="height: auto">
                        <ol class="sortable-options">
                            <li class="ui-sortable-handle">
                                <input value="11" type="text" name="question[1722453902890][option][]" data-attr="label"
                                    class="option-label option-attr" />
                            </li>
                            <li class="ui-sortable-handle">
                                <input value="22" type="text" name="question[1722453902890][option][]" data-attr="label"
                                    class="option-label option-attr" />
                            </li>
                            <li>
                                <input value="33" type="text" data-attr="label" name="question[1722453902890][option][]"
                                    class="option-label option-attr" />
                                <a class="remove btn remove-option" style="right: unset; width: unset">X</a>
                            </li>
                        </ol>
                        <div class="option-actions">
                            <a data-count="1722453902890" class="add add-opt">+ </a>
                        </div>
                    </div>
                </div>
            </div>
            <a class="close-field d-none">بستن</a>
        </div>
    </div>
</li>

this li have some input that can dynamically add or remove and a filed with title
when i clone this, new values not clone to new element
and cloned element have old values of inputs
how can duplicate this li with all current dynamic rows and values? (like google form)
thanks all

i tried to get element with

   var element = document.getElementById('id'+oldId);
    var element = $(document).find('#id' + oldId);
    var element = document.querySelector('#id' + oldId);
    var element = $(document.getElementById('#id' + oldId));
    var newElemnt = $(this).closest('li.FormItem').clone(true,true); 
    var newElemnt =  $(this).closest('li.FormItem')[0].outerHTML;
    var str = $(this).closest('li.FormItem').clone().wrap('<div/>').parent().html();
    //console.log(newElemnt.prop('outerHTML'));
    console.log(element.outerHTML());
    console.log(newElemnt.prop('innerHTML'));
    //console.log(element.prop('outerHTML'));
    //console.log(element.prop('innerHTML'));
    //console.log($(this).closest('li.FormItem').html());
    // console.log(oldId);

but all of then return old values (fresh li)
and can not get new value of elements