jQuery UI – is not a function

I’ve seen this problem a lot but no one ever comes up with a solution. I’m getting an error saying .sortable/.draggable/.droppable are not functions. Can anyone help? Relevant code below:

//template page

<script>
    jQuery(document).ready(function() {
        jQuery("#sortable").sortable({
            revert: true
        });
        jQuery("#draggable").draggable({
            connectToSortable: "#sortable",
            helper: "clone",
            revert: "invalid"
        });
        jQuery("ul, li").disableSelection();
    });
</script>

//functions page

/*load custom javascript*/
function occ_scripts_method() {
	wp_enqueue_script('jquery-ui-datepicker');
        wp_enqueue_script('jquery-ui-sortable');
        wp_enqueue_script('jquery-ui-draggable');
        wp_enqueue_script('jquery-ui-droppable');
        wp_enqueue_script(
		'custom-script',
                get_stylesheet_directory_uri() . '/lib/js/occscripts.js',
		array( 'jquery' )
	);

        wp_enqueue_style('jquery-style', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css');
}
add_action( 'wp_enqueue_scripts', 'occ_scripts_method' );