Jquery UI Auto complate and jquery autocomplete z-index

<link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
 
<script>
 $(function() {
    var availableTutorials = [
       "ActionScript",
       "Boostrap",
       "C",
       "C++",
       "Ecommerce",
       "Jquery",
       "Groovy",
       "Java",
       "JavaScript",
       "Lua",
       "Perl",
       "Ruby",
       "Scala",
       "Swing",
       "XHTML",
       "kit",
       "just",
       "jam",
       "janaki",
       "jay",
       "june",
       "july",
       "january"
    ];
    $( "#automplete-3" ).autocomplete({
       minLength:1,  
       delay:100,  
       source: availableTutorials,
       open: function () {
            $(this).autocomplete('widget').zIndex(999999);
        }
    });
   
 });
</script>


<div class="ui-widget">
          <input type="search" id="automplete-3" placeholder="Type here for search...">
</div>

Demo