<script>
const elements = document.getElementsByClassName('external_demand_span');
const appendTo = document.getElementById('external_demand');
const cats = new Map();
for (let i = 0; i < elements.length; i++) {
const element = elements[i];
const clone = element.cloneNode(true);
console.log(element);
console.log(element.dataset.customAttr);
if (!cats.has(element.external_demand_from)) {
cats[element.external_demand_from] = new Array();
}
cats[element.external_demand_from].push(clone);
clone.style.display = 'inline';
clone.classList.remove('external_demand_span')
}
cats.forEach((value, key, map) => {
const p = document.createElement('p');
p.innerText = key;
appendTo.appendChild(p);
value.forEach((s) => {
appendTo.appendChild(s);
})
})
</script>