Menu
I'm trying to dynamically add a <tr> with two <td>s into a <table> via javascript, but my fiddle doesn't seem to do anything, does anyone see the problem?
Fiddle: https://jsfiddle.net/otL69Lpo/2/
HTML:
<button type="button" onclick="myFunction()">Click Me!</button>
<table class="table table-bordered" id="chatHistoryTable">
<tr>
<td>
12:30:30
</td>
<td>
text here
</td>
</table>
JS:
function myFunction() {
var table = document.getElementById("chatHistoryTable");
var tr = document.createElement("tr");
var td = document.createElement("td");
var td2 = document.createElement("td");
var txt = document.createTextNode("TIMESTAMP");
var txt2 = document.createTextNode("user: text");
td.appendChild(txt);
td2.appendChild(txt2);
tr.appendChild(td);
tr.appendChild(td2);
table.appendChild(tr);
}
Output should be as:
| TIMESTAMP | user: text |
480
asked Sep 16 '26 13:09
This is a common issue in jsFiddle. There are several options for how to load the JS and you'll need to change the loading to either:
No wrap - in <head>No wrap - in <body>
150
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
