Estoy tratando de crear select
en una lista dinámicamente, tengo los valores en un array
.
var ruits = ["Banana", "Orange", "Apple", "Mango"];
function AddItem() {
var tbody = null;
var tabla = document.getElementById("tabla");
var nodes = tabla.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].nodeName == 'TBODY') {
tbody = nodes[x];
break;
}
}
if (tbody != null) {
var tr = document.createElement('tr');
tr.innerHTML = `<td>
<select>
<option>Seleccionar</option>
</select>
</td>`;
tbody.appendChild(tr);
}
}
<form>
<table id="tabla">
<thead>
<tr>
<th>Select</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<button type="button" onClick="AddItem();">Agregar item.</button>
</form>
Mi problema es que el select
creado dinámicamente tenga los valores del array intenté ponerlo en un foreach pero tampoco me funcionó.
Lo que trato de hacer es algo así:
tr.innerHTML = `<td>
<select>
ruits.forEach(function(element) {
<select>${element}</select>
});
</select>
</td>`;