Autocomplete is not working for div tag for the last backspace

--Scenario

I am given a task for autocomplete feature where the autocomplete feature will be in div tag instead of the showing like dropdown in textbox. Initially i thought its easy. But one problem i faced when i tried to do it in div tag.

--Suppose i have a textbox. And suppose i have set of records as below.
Anurag
Antony
Ajay
Alex

When i start typing A. I get all the autocomplete suggestion in div tag. But when i hit the last backspace, the suggestion in div tag doesnt get clear. 

So i started comparing with the normal autocomplete where the suggestion comes just below the textbox and the autocomplete which i was trying in a div tag.

when i enter something in the textbox and and press backspace and when i hit last backspace to clear the textbox it doesnt go to the debugger. So is there any way to perform autocomplete in a div tag ?

--------------What i was trying ------

<style type="text/css">
    .searchBox {
        background-image: url('Images/perfectlens.PNG');
        background-repeat: no-repeat;
        padding-left: 20px;
    }

    .text-label {
        color: #cdcdcd;
        font-weight: bold;
    }

    .focus {
        border: 2px solid #AA88FF;
        background-color: #FFEEAA;
    }
</style>



<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
    $(document).ready
        (function () {     
            $("#Employee").autocomplete
                ({
                    source: function (request, response) {
                        $.ajax({
                            url: "/SearchStore/Employeename",
                            type: "POST",
                            dataType: "json",
                            data: { term: request.term },
                            success: function (data) {
                                $('#autocompleteindiv').text('');
                                if (data.length > 0) {    
                                    response($.map(data, function (item) {
                                        $('#autocompleteindiv').append(item.EmployeeNames+ '</br>');
                                    }))
                                    }
                                else {
                                    $('#autocompleteindiv').text('');
                                    $('#autocompleteindiv').append('No Results Found');
                                   
                                }
                            }

                        })
                    },
                    minLength: 1
                });
        })

</script>


<div style="font-family: Arial">
    <input type="text" class="searchBox"
        value="StoreNumber"
        name="StoreNumber" id="Employee" title="Enter Store Number"
        onfocus="if (value == 'StoreNumber') {value=''};this.style.color='#000';"
         önblur="if (value== '') {value='StoreNumber'};this.style.color='#999';" size="15"
        style="font-weight: bold; color: #808080" />
</div>

<div id="autocompleteindiv" style="background-color:gray;width:600px;height:600px"></div>

---kindly help me.