Adding Keyboard Navigation to Ajax Live Search

Question

I've managed to add a working "Live Search" form to my PhP/MySQL web application using the tutorial provided by w3schools website. However, this form doesn't have any keyboard navigation and I feel like that really makes it kind of unusable. I've been attempting to add some navigation by searching/reading, but have failed entirely. I'm extremely new to Javascript, so obviously that's a huge hang up for me in understanding how to properly add the functionality. If anyone could please provide me with a decent example that at least adds one type of navigation (down arrow, enter key (to put selected value into the box, completed), etc), I think I could probably grep through that to add additional functionality.

Here's the code I've been working with thus far:

function showResult(str)
{
    if (str.length==0)
    {
        document.getElementById("livesearch").innerHTML="";
        document.getElementById("livesearch").style.border="0px";
        return;
     }

     if (window.XMLHttpRequest)
     {
          xmlhttp=new XMLHttpRequest();
     }
     else
     {
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
     }

     xmlhttp.onreadystatechange=function()
     {
         if (xmlhttp.readyState==4 && xmlhttp.status==200)
         {
             document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
             document.getElementById("livesearch").style.border="1px solid #A5ACB2";
         document.getElementById("livesearch").style.width="1000px";
         }
      }

      xmlhttp.open("GET","livesearch.php?q="+str,true);
      xmlhttp.send();
}

and the livesearch.php file I've been using is VERY similar to what can be found on the w3schools' site. I just modified it slightly to give me the results I needed, formatted how I needed.

Thanks for any help!