Navigation by Arrows in Div

Question

I’m doing an autocomplete on jquery and ajax, the results obtained by ajax I’ll put in <div>.

I wish the user could navigate with the arrow for the results, leaving the <input> and navigated by <div>.

$.ajax({
  url: "PartServlet.class.php?action=getArray&keys[stats]=Utilizavel&keys[name]="+word
}).done(function(list){
  if(list.result === 1){
    var buffer = "";
    $.each(list.obj, function(index,part){
      part = $.parseJSON(part);
      buffer += "<div class='partItem' data-id='"+part.id+"' data-name='"+part.name+"'>"+part.id+"-"+part.name+"</div>";
    });
    $("#autocomplete").html(buffer).css("display", "block");
  }
  ajaxRunning = false; 
}).fail(function (data){
  ajaxRunning = false;
  $("#autocomplete").html("").css("display","none");
});

<div>
  <input id="search" name="search" type="text" />
  <div id="autocomplete">
  </div>
</div>