javascript - Best way to split word in letters using DOM -

i have following structure.

<div class="container">   <span>word</span>   <span>word2</span>   <span>word3</span> </div> 

and want output be:

<span><b>w</b><b>o</b><b>r</b><b>d</b></span> 

to achieve use following code:

let containers = document.queryselectorall('.container');  array.from(containers, x => {            array.from(x.children, y => {              let text = y.innertext;         y.innerhtml = '';          for(let c of text) {             y.innerhtml += `<b>${c}</b>`;         }                }); }); 

but dont need clear html append letters wrapper.

does knows better solution achieve this?

http://jsbin.com/rexaqis/edit?html,css,js,output

try this:

y.innerhtml = y.innerhtml.split('').map(function(element){     return '<b>' + element + '</b>'; }).join('');