How to fill data dynamically in Highchart

Question

I'm using below code to display bar chart, I don't know how to populate value dynamically in name and y field. I've name and y data in javascript array.

var productsName = [Laptop,Photoframe,PuzzleBox];
var productPrintCount = [56,24,10]

I don't want to hardcode name and y value in chart, I want to populate dynamically, can someone help how can I put these value in below chart?

JSFiddle

 data: [{
        name: 'Laptop',
        y: 56
    }, {
        name: 'Photoframe',
        y: 24
    }, {
        name: 'PuzzleBox',
        y: 10
    }]

Answer 1

var productsName = ['Laptop', 'Photoframe', 'PuzzleBox'],
    productPrintCount = [56,24,10],
    mappingDataFn = function () {
            var resultData = [];
            $.each(productsName, function (key, value) {
                resultData.push({
                    'name': value,
                    'y': productPrintCount[key]
            });
        });
        return resultData;
    };
...
    series: [{
        name: 'Brands',
        colorByPoint: true,
        data: mappingDataFn()
    }]

The idea: mapping the data from a function. here the jsfiddle