Highcharts RandomColor Scatter Demo

HTML

<form>
    <p>Search the Chart:
        <input type="text" id="chartSearch" name="chartSearch">
        <input id="submitChart" type="submit" name="submit" value="Submit" />
    </p>
</form>
<div id="container" class="chart"></div>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

CSS

.chart {
    width:400px;
    height:400px;
    margin:0 auto;
    /*	background: #111111;*/
}

JavaScript

$(function () {
    function setColor() {
        //random Colors
        var letters = '0123456789ABCDEF'.split('');
        var color = '#';
        for (var i = 0; i < 6; i++) {
            color += letters[Math.round(Math.random() * 15)];
        }
        //console.log(color);
        return color;
    }

    function getData() {
        // making fake data
        var data = [],
            i;
        var arr = ["ARE", "BAR", "CAR", "BEE", "FOO", "RED", "TAB", "VERD", "LARE", "TAR", "HARD", "BANE", "FLWOO", "RED", "BAT", "WOW", "SARE", "STAR", "WARD", "BLAKE", "LOWER", "MARE", "YOU", "ZOO"];

        for (i = 0, l = arr.length - 1; i <= l; i = i + 1) {
            var color = setColor();
            data.push({
                name: arr[i] + i,
                x: Math.random() * 200 - 100,
                y: Math.random() * 200 - 100,
                radius: 4,
                color: color,
                fillColor: color
            });
        }
        return data;
    }
    var optObj = {
        chart: {
            renderTo: 'container',
            type: 'scatter'
        },
        title: {
            text: 'Chart of RandomData',
        },
        xAxis: {
            title: {
                enabled: true,
            },
            //define x axis
            min: -100,
            max: 100,
            startOnTick: true,
            endOnTick: true,
            showFirstLabel: false,
            showLastLabel: false,
            labels: {
                formatter: function () {
                    return this.value;
                }
            },
        },
        yAxis: {
            min: -100,
            max: 100,
            startOnTick: true,
            endOnTick: true,
            startOnTick: true,
            endOnTick: true,
            showFirstLabel: false,
            showLastLabel: false,
            labels: {
                formatter: function () {
                    return this.value;
                }
            },
    ...