Una forma sería

1. itere los identificadores de resultados y obtenga el objeto correspondiente del dom (combinado con su última ronda .forEach eliminando la clase d-done)
2. obtenga todos los elementos d-done y combine ambas listas
3. convertir a html y restablecer HTML interno del envoltorio

 let results = [2,1] let wrapper = document.getElementById('wrapper-id') wrapper.innerHTML = results.map(id => document.querySelector('#item-' + id)) .concat([...document.querySelectorAll('.d-none')]) .map(elem => elem.outerHTML) .join('')

 <div class="wrapper" id="wrapper-id"> <div class="item" id="item-1"> item-1 </div> <div class="item" id="item-2"> item-2 </div> <div class="item d-none" id="item-3"> item-3 </div> </div>

Puede mover elementos a la parte superior, usando la función prepend .

En el siguiente ejemplo, solo implemento la lógica sobre mover elementos, y no me protegí contra elementos inexistentes. Debe agregar su lógica sobre filtrado, etc. y protegerse de posibles errores.

 function sortDivs() { let list = [2, 1]; let mainDiv = document.querySelectorAll('.wrapper')[0]; list.reverse().forEach(n => mainDiv.prepend(document.getElementById('item-'+n))); }

 .item { border: black solid; }

 <div class="wrapper"> <div class="item" id="item-1"> item-1 </div> <div class="item" id="item-2"> item-2 </div> <div class="item" id="item-3"> item-3 </div> </div> <br> <button onClick="sortDivs()"> sort DIVs</button>

Resuelto

Tuve varios problemas:

El primero fue en lugar de usar Object.keys(results).filter , debería usar results.filter , porque no necesito obtener solo las claves, lo que dificultaba mucho las cosas.

En segundo lugar, la lógica a aplicar para que todo se reorganice de acuerdo con múltiples filtros es:

1. Ordenar/filtrar todo
2. Ocultar todos los elementos (usando d-none )
3. Coge todos los hijos de la envoltura const wrapperItems = wrapper.children
4. Cree una variable llamada wrapperNewItems que contenga los nuevos elementos ordenados/filtrados
5. Cree una variable que contenga qué ID (elemento 1, elemento 2, etc.) se han ordenado/filtrado
6. Empuje los elementos ordenados en la variable y elimine d-none
7. Empuje los elementos que NO se clasificaron en la variable y mantenga d-none

Traducido a código:

 document.querySelectorAll('.item').forEach(i => i.classList.add('d-none')); const wrapper = document.getElementsByClassName('wrapper')[0]; // Saves the existing children const wrapperItems = wrapper.children; // Holds the new items ordered perfectly let wrapperNewItems = []; // Holds names that were filtered (item-1, item-2, etc) let listOfNamesFiltered = []; // Shows only the items filtered results.forEach(item => { let name = 'item-' + item.id; let el = document.getElementById(name); el.classList.remove('d-none'); wrapperNewItems.push(el); listOfNamesFiltered.push(name); }); for (let i = 0; i < wrapperItems.length; i++) { let item = wrapperItems[i]; let name = item.id; // id="" already contains "item-{id}" // If the name already exists in the list, we won't add it again if (listOfNamesFiltered.includes(name)) continue; wrapperNewItems.push(item); } // Clears the div wrapper.innerHTML = ''; // Appends the items once again for (let i = 0; i < wrapperNewItems.length; i++) wrapper.innerHTML += wrapperNewItems[i].outerHTML;