Javascript - Как выполнить цикл для печати идентификатора элемента html в отсортированном номере?

Question

Здравствуйте, Извините за вопрос для начинающих. Я хочу напечатать HTML код элемента или имя в номер цикла, как этот

<button id="foo1" name="foo1>foo</button> 
<button id="foo2" name="foo2">foo</button> 
<button id="foo3" name="foo3">foo</button> 
................ 
<button id="foo10" name="foo10">foo</button> 

для меня это будет работать, если я использую язык PHP, чтобы цикл

for($i = 1; $i <= 10 ;$i++) { ?> 
    <button id="foo<?php echo $i; ?>"> <?php } ?> 

Но некоторые дела, я должен make loop in javascript language. Я пробовал это

var i; 
    for(i=1; i<=10; i++) 
    { 
var newspan = document.createElement('span'); 
    newspan.innerHTML = 'button id="foo + i"' ; 
document.getElementById('product').appendChild(newspan); 
    } 

но не работа.

Answer 1

Вы не присоединени HTML тег, просто кнопку слова, попробуйте ...

HTML:

<div id="product">  
</div> 

JS:

for(var i=1; i<=10; i++) { 
    var newspan = document.createElement('span'); 
    var currentFoo = 'foo' + i; 
    newspan.innerHTML = '<button id="'+ currentFoo + '">' + currentFoo + '</button>'; 
    document.getElementById('product').appendChild(newspan); 
} 

JSFiddle