Dynamically create buttons with Jquery

try this:

var something = $('<input/>').attr({ type: 'button', name:'btn1', value:'a button' });

now append this to your div (in this example, it has the id "item"):

$("#item").append(something);

of course, for dynamic values, you need to do it inside a loop with iterated values of the name or ID field of the button..

hope explaining the concept helps :)

$(document).ready(function() {
  for(i = 1; i <=10; i++) {
     $('<button/>', {
        text: i, //set text 1 to 10
        id: 'btn_'+i,
        click: function () { alert('hi'); }
    });
  }
});

Hope it helps

I created this little guy. Think the individual functions are overkill, but this is what the question asked for(i think):

https://jsfiddle.net/mmv1219/koqpzrar/1/

html:

<button type="button" id="Delta1">Blast Off!</button>
<div id="insertHere"></div>

JavaScript:

$('#Delta1').click(function () {
    var functions = ['btn1()', 'btn2()', 'btn3()', 'btn4()', 'btn5()', 'btn6()', 'btn7()', 'btn8()', 'btn9()', 'btn10()'];
    var div = document.getElementById('insertHere');
    var ctr = 1;
    for (var i in functions) {

        var btn = document.createElement('button');
        var txt = document.createTextNode(String(ctr));

        btn.appendChild(txt);
        btn.setAttribute('type', 'button');
        btn.setAttribute('onclick', functions[i]);
        btn.setAttribute('id', 'button' + ctr);
        div.appendChild(btn);
        ctr++;
    }
});

function btn1() {alert('button 1');}    
function btn2() {alert('button 2');}    
function btn3() {alert('button 3');}
function btn4() {alert('button 4');}
function btn5() {alert('button 5');}
function btn6() {alert('button 6');}
function btn7() {alert('button 7');}
function btn8() {alert('button 8');}
function btn9() {alert('button 9');}
function btn10() {alert('button 10');}