In wordpress, you should always use enqueue to include scripts and styles.
Find functions.php file inside your theme, go to the end and add following
function call_custom_scr_styles() {
wp_enqueue_style( 'flexslider-style', get_template_directory_uri() . '/css/flexslider.css' );
wp_enqueue_script( 'jquery-custom', 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js', array(), '1.0.0', true );
wp_enqueue_script( 'flexslider-script', 'http://electives-abroad.org/jquery.flexslider.js', array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'call_custom_scr_styles' );
note: I assumed you have flexslider.css file inside your theme directory/css folder. if not, change the location
In this case why you get errors because your browser cannot properly render required content and resources. You should include jQuery as first because flexSlider’s scrips have dependencies on jQuery. then you said you uploaded css file into your site using ftp but you didn’t call that but you call yyour flexslider css from http://electives-abroad.org/flexslider.css.
Make sure all your resources are available, and browser is capable of loading/rendering everything.
TypeError: $(…).on is not a function is caused because $ symbols you’ve used in your scripts are not defined. probably because jQuery error. could be not properly included or either JS conflict.
Uncaught TypeError: this.sliderElement.on is not a function is because browser doesn’t know what to do when this.sliderElement.on is called. As I said before, flexslider require jQuery and for that, jQuery should have loaded before your flexslider script loads.