How to retain the value whilst selecting more using GetElementById

Question

I want to know how to retain values clicked and get more with my keyboard to make a word as opposed to one single letter?

function f(i) {
    document.getElementById('txt').value
     = (document.getElementById(i).firstChild.nodeValue);

<td  id='i1' onclick='f("i1");' class='big'>A</td>
<td  id='i2' onclick='f("i2");' class='big'>B</td>
<td  id='i3' onclick='f("i3");' class='big'>C</td>
<td  id='i4' onclick='f("i4");' class='big'>D</td>
<td  id='i5' onclick='f("i5");' class='big'>E</td>
<td  id='i6' onclick='f("i6");' class='big'>F</td>
<td  id='i7' onclick='f("i7");' class='big'>G</td>
<td  id='i8' onclick='f("i8");' class='big'>H</td>
<td  id='i9' onclick='f("i9");' class='big'>I</td>
<td align='center' bgcolor='red' colspan=3> <input type='text' id='txt'></td>

Answer 1

You probably want to change the = for += to append the pressed value, instead of just replacing it.