Why does changing the name of my function break my JavaScript?
<p>I have the following which works perfectly</p>

<pre><code>$(function() {

    // Create the chart
    chart = new Highcharts.StockChart({
        ...
    });
});
</code></pre>

<p>However when I make the following modification</p>

<pre><code>createCharts();
function createCharts() {

    // Create the chart
    chart = new Highcharts.StockChart({
        ...
    });
}
</code></pre>

<p>I get the following error message</p>

<p>Message: 'Highcharts' is undefined</p>

<p>Nothing else has changed why does the above break my script?</p>
