Javascript 排序后如何将数组元素包装到html标记中？

我试图将每个数组元素包装在一个范围中。所以我可以稍后添加一个类。但我真的不知道怎么做。 这是我的密码：

let hit = 0;
let pick = props.selected.length;
let payout = null;
let currentPayout;
let pickList = '';
props.selected.sort((a, b) => {
    if (a > b) return 1;
    if (a < b) return -1;
    return 0;
}).forEach((n) => {
    if (pickList.length) {
        pickList += ' ';
    }
  // Here's the mess, I'd like to be able to wrap each number in a span.
       pickList =+ n;
});

let hit=0；
让拾取=props.selected.length；
设派息=null；
让我们来支付；
让pickList=''；
道具。选定。排序（（a，b）=>{
如果（a>b）返回1；
如果（a{
if（pickList.length）{
挑选名单+=''；
}
//这里的混乱，我想能够包装在一个跨度每个数字。
选择列表=+n；
});

要生成HTML，可以执行以下操作：

let pickList = props.selected.sort((a, b) => a - b)
                    .map(n => `<span>${n}</span>`)
                    .join('');

---

现在，pickList是一个DOM节点数组。如果需要在页面（文档）上显示它们，则对数组中的每个节点使用容器元素上的

appendChild

方法

要创建HTML字符串或DOM节点列表吗？

let pickList = props.selected.sort((a, b) => a - b)
    .map(n => {
        const span = document.createElement('<span>');
        span.textContent = n;
        return span;
    });