My code is not working in autocomplete

My code is not working in autocomplete

Im new to Jquery

Here is my code

<!DOCTYPE HTML />
<html>
    <head>
        <title>Demo</title>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/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.2/jquery-ui.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                var someJSON = ['Chai', 'Chang', 'Aniseed Syrup', 'Chef Anton\u0027s Cajun Seasoning', 'Chef Anton\u0027s Gumbo Mix',
                                'Grandma\u0027s Boysenberry Spread', 'Uncle Bob\u0027s Organic Dried Pears', 'Northwoods Cranberry Sauce', 'Mishi Kobe Niku',
                                'Ikura', 'Queso Cabrales', 'Queso Manchego La Pastora', 'Konbu'];

                $(".txtproductname").autocomplete({ source: someJSON });

                $("#click").click(function () {
                    $("#mytable").find('tbody').append($('<tr><td><input type="text" class="txtproductname" /></td></tr>'));
                });
            }); 
        </script>       
    </head>
    <body>
        <div>
            <table id="mytable">
                <thead><tr><th>Item Name</th></tr></thead>
                <tbody>

                   </tbody>
                <tfoot></tfoot>
            </table>
        </div>
        <button id="click" style:="width:173px;height:56px;">Add TextBox</button>
    </body>
</html>

i Need Help