js 动态创建了多个div并在新创建的div里再创建canvas标签

Question

动态创建了几个div，然后想在创建好的每个div里分别再创建一个canvas标签。
下面是我用for循环创建的多个div;

for (n = 0; n<8; n++) {
        var oDiv=document.createElement('div');
        document.body.append(oDiv);
    }

最后大概是这样的效果。
怎么样能使每个div都只有一个canvas？

<div><canvas></canvas></div>
<div><canvas></canvas></div>
<div><canvas></canvas></div>
<div><canvas></canvas></div>
<div><canvas></canvas></div>

Answer 1

for (n = 0; n<8; n++) {
        var oDiv=document.createElement('div'),
            canvas = document.createElement('canvas');
        oDiv.appendChild(canvas);
        document.body.appendChild(oDiv);
    }

Answer 2

for (n = 0; n<8; n++) {
        var oDiv=document.createElement('div');
        document.body.append(oDiv);
        oDiv.html="<canvas></canvas>";
    }