title: Set the z-index value of a jQuery autocomplete input a level above the result list itself
body: <p>The default behavior for the jQuery Autocomplete widget is to position the results list one z-index level above the input so that the latter is always visible but in my case this has the undesirable effect of overshadowing the text input element.</p>
  
  <p>I tried to set the z-index value input element at least one level above that of the result list from within the open method like so without much success:</p>
  
  <pre><code>open: function () {
      setTimeout(function () {
          $(this).css('zIndex', 10000);
      }, 1);
  },
  close: function () {
      $(this).css('zIndex', 0);
  }
  </code></pre>
  
  <p>The z-index level for the input element does get promoted to 10000 while that of the results list remains at level 1 but the input element still appears underneath it.</p>
  
  <p>Does anyone have a clue on why this is happening?
  The position attributes for the results list and input element are set to absolute and relative respectively. Could that be the cause?</p>