javascript - prepare to focus first active element in a container -

i have container on page should prepared focusing, i.e. when user pressed tab button, first active element in container must focused.

the simplest way have thought far find last active element before container, focus , blur it. work? there simpler way? how find last active element before container (cross-browser)?

i not want change tabbed elements order, want define next element selected.

please use raw javascript, not frameworks.

the thing can think of looping on container child nodes , try focusing them until succeed:

<script type="text/javascript"> document.onkeyup = function (e) {     if (!e)         e = window.event;     var keycode = e.keycode || e.which;     if (keycode == 9) {       focusfirst(document.getelementbyid("mycontainer"));     }  }  function focusfirst(element) {     try {         element.focus();     }     catch(ex) {}      if (document.activeelement == element)         return true;      (var = 0; < element.childnodes.length; i++) {         var ochild = element.childnodes[i];         if (focusfirst(ochild))             return true;     }      return false; } </script> 

sample html tested with: (ie, chrome)

<div id="mycontainer">     <div>hello</div>     <div><span><input type="text" /></span></div>     <div><input type="text" /></div> </div> 

this focus first input box of container upon tab click.