Dialog produces TypeError: $(...)button is not a function

Dialog produces TypeError: $(...)button is not a function

Running the CODE in 1., below, produces this error.

TypeError: $(...).button is not a function

text: false
jquery.ui.dialog.js line 351

The status on all files opened is 200. Permissions on all files is 777.

I don't have a clue as to why this is happening or how to fix this.

Thanks for any help to solve this.

R


  1. <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>Dialog</title>
            <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.10.3.custom.css">
        </head>
        <body>
            <div id="myDialog" title="This is the title!">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean sollicitudin. Sed interdum pulvinar justo. Nam iaculis volutpat ligula. Integer vitae felis quis diam laoreet ullamcorper. Etiam tincidunt est vitae est.</div>
            <script src="development-bundle/jquery-1.9.1.js"></script>
            <script src="development-bundle/ui/jquery.ui.core.js"></script>
            <script src="development-bundle/ui/jquery.ui.widget.js"></script>
            <script src="development-bundle/ui/jquery.ui.position.js"></script>
            <script src="development-bundle/ui/jquery.ui.dialog.js"></script>
            <script>
                (function($){
                    $("#myDialog").dialog();
                })(jQuery);
            </script>
        </body>
    </html>