CodingForums.com - values get hidden after beeing posted

I'm trying to to display the inputted data in the form using the addRow() function but i don't know why shortly after pressing the submit button the table quickly show and hides the values. Can anyone take a look in the code and tell me what i'm doing wrong , i think i'm loosing it here :-(

This is the code:

Code:

<HTML>

  <HEAD>

    <TITLE>Test sample</TITLE>

    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">

        <link rel="stylesheet" href="style.css" type="text/css" />

        

        <script language="javascript">

 

 

function addRow(){

    var table = document.getElementById('results');

    var row = document.createElement('tr');

    var td1 = document.createElement('td');

    var td2 = document.createElement('td');

    var td3 = document.createElement('td');

    td1.innerHTML = document.getElementById('name).value;

    td2.innerHTML = document.getElementById('lname').value;

    td3.innerHTML = document.getElementById('year').value;

    row.appendChild(td1);

    row.appendChild(td2);

    row.appendChild(td3);

    table.children[0].appendChild(row);

}

 </script>

        

  </HEAD>

  <BODY>

  <h1 style="text-align:center;"> <h1>Text heading</h1>

  <h5 style="text-align:left;"> <h5> Text heading sample </h5>

  

<form>

Name:<br>

<input type="text" id="name"><br>

Last Name: <br> 

<input type="text" id="lname"><br>

Age: <br>

<input type="text" id ="year"><br>

<input type="submit" id ="buton" value="Submit" onclick="addRow()">

</form> 





<table border="1" id = "results">

<tr>

<th>Name</th>

<th>Last Name</th>

<th>Age</th>

</tr>

</table>



  

  </BODY>

</HTML>