how do I get two highcharts on one page?

I am not really sure what some of your code is trying to do - seems a little needlessly complicated, FWIW

AS to how to make multiple charts on the same page - you do it just like you would make one chart on a page, just do it more than once :)

and make sure you have different container element ids - otherwise you are just overwriting one chart with the next.

One example of multiple charts on a page:

http://jsfiddle.net/kwtZr/1/

there's no relevant code to put here, just click the link

If you're trying to get two charts on one page then it is VERY simple.

    <div id="chart-A" class="chart"></div>
    <div class="spacer"></div>
    <div id="chart-B" class="chart"></div>

CSS - Just to make the example a little easier on the eyes

    .chart {
        height: 200px;
    }

    .spacer {
        height: 20px;
    }

JavaScript

    $(function() {

        // If you need to specify any global settings such as colors or other settings you can do that here

        // Build Chart A
        $('#chart-A').highcharts({
            chart: {
                type: 'column'
            },
            title: {
                text: 'Chart A'
            },
            xAxis: {
                categories: ['Jane', 'John', 'Joe', 'Jack', 'jim']
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Apple Consumption'
                }
            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            tooltip: {
                shared: true
            },
            series: [{
                name: 'Apples',
                data: [5, 3, 8, 2, 4]            
            }]
        });

        // Build Chart B
        $('#chart-B').highcharts({
            chart: {
                type: 'column'
            },
            title: {
                text: 'Chart B'
            },
            xAxis: {
                categories: ['Jane', 'John', 'Joe', 'Jack', 'jim']
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Miles during Run'
                }
            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            tooltip: {
                shared: true
            },
            series: [{
                name: 'Miles',
                data: [2.4, 3.8, 6.1, 5.3, 4.1]
            }]
        });
    });

Here's a JSFiddle: http://jsfiddle.net/engemasa/7cvCX/