How to clone html elements from array to new parent element

hvma411 :

I've got a task to do - to do list. I have a problem because i don't know how to move elements from parent "priority" to parent "standard".

My code of button to move is:

moveToStandardButton.addEventListener('click', function() {
    const allListElements = document.querySelectorAll('[data-id="move"]');
    for (let i = 0; i < allListElements.length; i++) {
        let toClone = allListElements[i].checked;
    }
})

toClone shoud have all list elements which are checked by user and then after click button it should move this elements to parent "standard". I've tried to do it like this but i can't use cloneNode at toClone or toClone[i].

Asher Gunsay :

If you log toClone, it is probably a boolean (true or false), as it is pulling whether the element is checked.

Try the following:

moveToStandardButton.addEventListener('click', function() {
    // Get all elements that have a data-id of move
    // I'm assuming these elements are the ones that need to move ;)
    const allListElements = document.querySelectorAll('[data-id="move"]');
    // iterate through the elements that need to move
    for (let i = 0; i < allListElements.length; i++) {
        let toClone = allListElements[i]; // Note that 'checked' isn't involved
        if(!toClone.checked) continue; // If the element isn't checked, move to next element.
        const clonedEl = toClone.cloneNode(true);
        document.querySelector('#myOtherList').appendChild(clonedEl);
    }
})