Uncaught TypeError: undefined is not a function

Question

I'm keep getting uncaught type error for autocomplete function. However, i have the exact same code on another jsp, but that one works just fine..... is there something that i absolutely remember when I use autocomplete?

   <title>Insert title here</title>
<script type="text/javascript"  src="http://code.jquery.com/jquery-1.10.2.js"></script>
<link rel="stylesheet"  href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<link rel="stylesheet"  href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
    $(function() {

        $("#med_name").autocomplete({
            source : function(request, response) {
                $.ajax({
                    url : "${pageContext.request.contextPath}/searchMed.do",
                    data : {
                        search : $("#med_name").val()
                    },
                    dataType : "json",
                    type : "post",
                    success : function(jsonData) {
                        response($.map(jsonData.medlist, function(item) {
                            return {
                                value : item.imed_name,
                                label : item.imed_name,
                                id : item.imed_id,
                                dos : item.imed_dos,
                                img : item.imed_img
                            };
                        }));
                    }
                })
            },
            select : function(event, ui) {
                alert(ui.item.img);
                $("#med_imed_id").val(ui.item.id);
                $("#med_dos").val(ui.item.dos);
                $("#med_img").attr("src", "medimg/" + ui.item.img);
            },
            selectFirst : false,
            minLength : 1,
            focus : function(event, ui) {
                $('#med_name').val(ui.item.label);
                return false;
            },
        });
});

above is the js portion and below is jsp portion

 <table>
            <tr>
                <th colspan="2">Prescription</th>
            </tr>
            <tr>
                <th>Medication</th>
                <td><input type="text" id="med_name" name="med_name"/><input
                    type="hidden" id="med_imed_id" name="med_imed_id" value="" /></td>
            </tr>
            <tr>
                <th>Dose</th>
                <td><input type="text" id="med_dos" name="med_dos" /></td>
            </tr>
            <tr>
                <td colspan="2"><img src="" alt="" id="med_img" name="med_img"/></td>
            </tr>
            <tr>
                <td colspan="2"><input type="button" id="addBnt" name="addBnt"
                    value="add" /></td>
            </tr>
        </table>

Answer 1

Can you confirm that Jquery UI is loading properly? I checked out that link and autocomplete is included it should be working. Also remove one of those Jquery calls. Thanks!