javascript - Selecting List Element (capturing down/up arrow) -

I have the HTML structure ('ul li' given as drop down / selection)

  & lt; Input id = "fetch input" type = "text" / & gt; & Lt; Div class = "suggestion" & gt; & Lt; Ul & gt; & Lt; Li value = "0" name = "new york" & gt; New York & lt; / Li & gt; & Lt; Li value = "1" name = "London" & gt; London & lt; / Li & gt; & Lt; Li value = "2" name = "Paris" & gt; Paris & lt; / Li & gt; & Lt; Li value = "3" name = "sydney" & gt; Sydney & lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt;   
 Arrow key press event requires javascript / jquery code to capture below (on input), which will first select the 'li' element  
 continuously down key Select the next 'Li' elements; And select the key 'previous' elements above.   
 
 
 Since your question is a bit unclear, it is not exactly what you are trying to accomplish Are there.  
 If you are trying to highlight  li  elements, use it:  
  var $ ListItems = $ ('li '); $ ('Input') keydown (function (e) {var key = e.keycode, $ selected = $ listItems.filter ('. Selected'), $ current; if (key! = 40 & amp; key! = 38) return; $ listItems.removeClass ('selected'); if (key == 40) // key below {if ($ $ selected. Length = $ is selected. This (': last-child')) { $ Current = $ listItems.eq (0);} and {$ current = $ select.next ();}} and if (key == 38) // key above {if (! $ Selected.length || $ selected .is (': first-child')) {$ current = $ listItems.last ();} and {$ current = $ select.prev ();}} $ current.addClass ('selected');}); a????   
 Here's the answer:  
 
 If you are trying to set the value of your  input  field, the last change To do this, line:  
  $ (this) .val ($ current.addClass ('selected'). Text ());   
 Below is: