JQuery UI Dialog TypeError: Object [object Object] has no method 'dialog' (no repeated reference to jquery or jquery-ui)

I know there are many other similar questions on here, but none of them have solved my problem.

I am trying to create a dialog box which prompts the user to choose whether to leave the page (and continue to the link they just clicked) loosing the text they have entered in a textarea, or stay on the page.

Many other answers say to check for repetition of the reference to JQuery, so I have stripped out all references and put in the following at the top of my _Layout.cshtml page.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

Other answers have also looked at whether the relevant parts of UI were included. I believe the above reference includes everything?

So here is my script, included at the bottom of the relevant page, and the div (I got the div and script from another answer about how to create the dialog). I have included my other scripts in case that is causing a problem.

<div id="dialog" title="Confirmation Required">
  Are you sure about this?
</div>

<script type="text/javascript">    
    $(document).ready(function ()
    { 
        $("#dialog").dialog({
            modal: true,
            bgiframe: true,
            width: 500,
            height: 200,
            autoOpen: false
        });

        $("a.profile").click(function (e) {
            e.preventDefault();
            var hrefAttribute = $(this).attr("href");

            $("#dialog").dialog('option', 'buttons', {
                "Confirm": function () {
                    window.location.href = hrefAttribute;
                },
                "Cancel": function () {
                    $(this).dialog("close");
                }
            });

            $("#dialog").dialog("open");
        });

        $('a.ico').click(function (event) {
            expandTextArea();
        });
        $('textarea#notes').blur(function () {
            expandTextArea();
        });
    });    

    function expandTextArea()
    {
        $("textarea#notes").height($("textarea#notes")[0].scrollHeight);
    }
</script>

I would greatly appreciate it if someone could point out what is wrong, or give me a better solution for creating my confirmation dialog.

Thank you in advance.

Addition:

This is the error I get in the console in Chrome:

Uncaught TypeError: Object [object Object] has no method 'dialog'     person:403
(anonymous function)                                                  person:403
c                                                                     jquery.min.js:4
p.fireWith                                                            jquery.min.js:4
x.extend.ready                                                        jquery.min.js:4
q                                                                     jquery.min.js:4

Person is a partial page in the page index.cshtml that contains the jquery.

@Html.Partial("_Person", Model.Person);