php/js/ajax search box

Question

I have a Google style searchbox. However, unlike with Google I don't want page to change when user selects from suggestions as there are other fields. Instead, I am using javascript to set a value in the email field once a user selects it. My problem is all the suggestions remain, filling up screen.

javascript:

function setEmail(address) {
//alert(address);
var email = '<input type="email" name="to" value="\''+address+'\'">';
document.getElementById('box').innerHTML = email;
document.getElementById('suggestions').innerHTML = "";
}

links returned by ajax:

<a href="javascript:void(0);" onclick="setEmail('.$address.');">Name</a>

html:

Edited to show answer below:

<input id="box" type="email" name="to" onkeyup="showSuggestions(this.value)">

Edit 2: To make the suggestions disappear after selection, I set the suggestion box to "".

Answer 1

You need to give the input an ID. like this:

<input id="emailField" type="email" name="to" onkeyup="showEmail(this.value)">

And change this:

document.getElementById('emailbox').innerHTML = email;

To this:

document.getElementById('emailField').value = email;