I found this answer on the website and used it as a base for my own code.
I was trying to get the buttons to render within the table but it just came up as text and n
You need to create a button node and then append it.
function tableCreate() {
var body = document.getElementsByTagName("body")[0];
var tbl = document.createElement("table");
var tblBody = document.createElement("tbody");
for (var j = 0; j <= 10; j++) {
var row = document.createElement("tr");
for (var i = 0; i <10; i++) {
var cell = document.createElement("td");
var button document.createElement("button");
button.innerHTML = j +"-"+i;
cell.appendChild(button);
row.appendChild(cell);
}
tblBody.appendChild(row);
}
tbl.appendChild(tblBody);
body.appendChild(tbl);
tbl.setAttribute("border", "2");
}
function cell_id(x,y){
msg('x:'+x+ ' y:'+y)
}
createTextNode()
creates a text node, as the name says. If you have markup in it, it will be shown literally.
You should have created a button
node, and set its text to the variables like this example below.
for (var i = 0; i <10; i++) {
var cell = document.createElement("td");
var btn = document.createElement("button");
btn.innerText = j + "-" + i;
cell.appendChild(btn);
row.appendChild(cell);
}
Use document.createElement('button')
for creating buttons. You are just creating textNodes using createTextNode()
.