Edit in JSFiddle

var my_name = ["Albert","Allen","Aladin","Nilesh","Dharmesh","Aakesh","Pankaj","Vijay","Manoj","Zahir","Mukesh","Kishor","Sachin","Rakesh"];
//Values for autocomplete list

$(document).ready(function(){

$("#my_name").unbind('keyup').keyup(function(e){
       
            if(e.keyCode == 13)
            {// Enter
                if ($(".services").is(":visible"))
                {
           
                    my_value = $(".selected").attr('id');
                    var my_id = $(".selected").attr("value");
                        $( "#my_name" ).val(my_value);
                    $(".services").empty();
                    $("#auto_my_name").slideUp();
                   
                }
                else
                {
                        $(".services").show();
                }
             }
       
            else if(e.keyCode == 38)
            { // up

                var selected = $(".selected");
                $(".services li").removeClass("selected");
                // if there is no element before the selected one, we select the last one
                if (selected.prev().length == 0)
                {
                    var child = selected.siblings().length + 1;
                $(".services li:nth-child("+child+")" ).addClass("selected");
                }
                else
                { // otherwise we just select the next one
                selected.prev().addClass("selected");
                }
            }
       
            else if(e.keyCode == 40)
            { // down
                var selected = $(".selected");
                $(".services li").removeClass("selected");
                if (selected.next().length == 0)
                {
                    $(".services li:nth-child(1)" ).addClass("selected");
                }
                else
                {
                    selected.next().addClass("selected");
                }
              }
             
              else
              {
                  call_name("my_name");
                 
              }
    });
       
});
   
   
function call_name(param)
{
    $(".services").empty();
    var temp_name = $("#"+param+"").val().toUpperCase().trim();
    var container = "";
    $("#auto_"+param+"").empty();
    if(temp_name != "")
    {
        if(param == "my_name")
        {
            var j = 0;
            for(i=0;i<my_name.length;i++)
            {
                container = my_name[i].toUpperCase().toString();
               
                if(container.indexOf(temp_name) >= 0)
                {
                   
                    if(j == 0){var selected = 'selected';}else{var selected = 'abc';}
                    $("#auto_"+param+"").append("<li class='listing "+selected+"' id='"+my_name[i]+"'>"+my_name[i]+"</li>");               
                    j++;
                }
                else
                {
                    $("#auto_"+param+"").hide();
                }
            }
        }
       
           
           
        $(".services li").mouseover(function()
        {
            $(".services li").removeClass("selected");
            $(this).addClass("selected");
        });
       
        $(".services li").click(function() {
            var my_value = $(this).attr('id');   
                selectOption(my_value, param);
                $(".product_class").empty();
            $(".services").empty();
        });
        var my_width = $("#"+param+"").width() + 5;
   
        $("#auto_"+param+"").width(my_width);
        $("#auto_"+param+"").width(my_width);
        $("#auto_"+param+"").slideDown();
       
       
        $("#"+param+"").unbind('blur').blur(function() {
            var my_value = $(".selected").attr('id');
            var my_id = $(".selected").attr("value");
            if($("#"+param+"").val() == "")
            {
                $("#"+param+"_id").val("");
            }
           
                selectOption(my_value, param, my_id);
            $("#auto_"+param+"").slideUp();
            $(".services").empty();
        });
       
           
    }
    else
    {
            $("#auto_"+param+"").slideUp();
    }
   
}

function selectOption(my_value, param, my_id)
{
   
    $( "#"+param+"" ).val(my_value);
    $( "#"+param+"_id" ).val(my_id);
    $("#auto_"+param+"").slideUp();
}

<input type="text" class="" id="my_name" value="" placeholder="Enter Name" autocomplete="off"/>
<ul class="services" id="auto_my_name">
                   
</ul>

#auto_my_name
{
    border:1px solid #cccccc;
    width:auto;
    font-family:verdana, arial, helvetica, sans-serif;
    font-size:15px;
    height:auto;
    margin-top:0px;
    list-style:none;
    position: absolute;   /*display:none;*/
    padding: 0;
    background-color: #EAEAEA;
    z-index:1;
    box-shadow:6px 6px 8px #cccccc;
}

#auto_my_name li
{
    height:25px;
}

#my_name
{
    width:100px;
}

.services li.selected{
    background-color:#636060;
    color:#ffffff;
}