Question

I have this js code to add (clone) and delete an element.

$('#btnAdd1').click(function (event) {
    var num = $('.linguas').length;
    var newNum = new Number(num + 1);

    var newElem = $('#input_' + num).clone(false).prop('id', 'input_' + newNum);

    newElem.children(':text').val('');

    $('#input_' + num).after(newElem).find('#input_' + num +'> option:selected').removeAttr("selected");
    $('#btnDel1').prop('disabled', '');
    if (newNum == 4) $('#btnAdd1').prop('disabled', 'disabled');
});

However, i want to remove the select="select" attribute, cloned from previous element.

I am trying something like this, but didn’t work:

 $('#input_' + num).after(newElem).find('#input_' + num +'> option:selected').removeAttr("selected");

demo here

thanks

Answer 1

Try this alone:

$('option:selected', newElem).prop("selected", false);

Your code:

$('#input_' + num).after(newElem).find('#input_' + num +'> option:selected').removeAttr("selected");

put the cloned select after the original, but then you searched for selected options using find on your original select. find searches children. The cloned select is now a sibling of the original not a child.