Adding <TR> to a <TABLE> with .appendChild

html, javascript

Solution

Try to change this line:

td.innerHTML = (" + bowlersName + ");

To this:

td.innerHTML = "(" + bowlersName + ")";

Problem

Everytime I try to enter a new cell to the table it doesn't add the text in the bowlersName value. Is there something wrong with my Javascript code? It says "undefined". ``` <script type="text/javascript"> /* <![CDATA[ */ function addBowler() { var newBowler = document.getElementsByName('bowlersName').value; var tr = document.createElement('tr'); var td = tr.appendChild(document.createElement('td')); td.innerHTML = newBowler; document.getElementById("bowlerList").appendChild(tr); } /* ]]> */ </script> </head> <body> <!-- HEADER 1 & 2 --> <h1>Central Valley Lanes</h1> <h2>2008 Bowling Teams</h2> Bowler's name <input type="text" name="bowlersName" size="15" /><input type="button" value="Add Bowler" onclick="addBowler()" /> <h2>Team Roster</h2> <form action="FormProcessor.html" method="get"> <table border="1" id="bowlerList"> <tr> <td id="empty">Your team roster is empty</td> </tr> </table> <br /> <input type="button" value="Submit Roster" /> </form> </body> ```

Original source