Highcharts :Uncaught TypeError: $(...).highcharts is not a function

Question

Getting this error while running a HighCharts in my JSP Application.

Uncaught TypeError: $(...).highcharts is not a function(anonymous function) @ VendorReports:125n.Callbacks.j @ jquery-1.11.0.js:893n.Callbacks.k.fireWith @ jquery-1.11.0.js:928n.extend.ready @ jquery-1.11.0.js:982K @ jquery-1.11.0.js:989 

Please suggest what to do

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="http://code.highcharts.com/highcharts.js"></script> <script src="http://code.highcharts.com/modules/exporting.js"></script> 

$(function () {     $('#container').highcharts({         colors: ["#7cb5ec", "#f7a35c"],         chart: {             type: 'column'         },         title: {             text: 'Total fruit consumtion, grouped by gender'         },         xAxis: {            categories: ['Apples' ]         },         yAxis: {             allowDecimals: false,             min: 0,             title: {                 text: 'Number of fruits'             }             //Nothing wrong with this code 

Answer 1

I was having this issue, too. Ensure jQuery is imported before highchart.js. That fixed the issue for me.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="http://code.highcharts.com/highcharts.js"></script>