colors - How to change margin each of the characters of string in javascript? -

i have string "hello world!".

i want change each margin of characters in "hello world!" word in javascript. example:

margin of "h" character 5px;

margin of "e" character 3px;

e.t.c

how can it?

var color = ['#ff0000','#00ff00','#0000ff'];  window.onload = function() {   var div = document.getelementbyid('sample');   var str = 'abc';   for(var i=0;i<str.length;i++)   {       var span = document.createelement('span');       var text  = document.createtextnode(str[i]);       span.style.color = color[i];       span.appendchild(text);       div.appendchild(span);   } }  <div id='sample'></div> 

sample fiddle

have on above code . may . reason why used span here cannot style text nodes way can appending text nodes span

here have shown 3 characters . can same 'n' number of characters