Javascript - How to add objects to column array in

I am trying to generate objects in the columns array as the heading implies, although I haven't found a working method.

alert( "Value 1: " + temporaryArray[1] + " - " + finalArray[1].values ); 
alert( "Value 2: " + temporaryArray[2] + " - " + finalArray[2].values ); 
var myGrid =  $("#grid").kendoGrid( 
{
    columns: 
    [
        {
            title: temporaryArray[0] + " ",
            field: gridArray[0].values + " "
        }
    ],
    dataSource: 
    {
        data:finalArray,
        pageSize:10
    },
    scrollable:false,
    pageable:true 
});

I've tried the following to add the object:

for( var x = 0; x < finalArray.length; x++ )
{
    myGrid[columns] = { temporaryArray[x]:finalArray[x] };
}

And

for( var x = 0; x < finalArray.length; x++ )
{
    myGrid.columns[values]= finalArray[x].values;
}

with no success...

The following looks like an array of objects inside of the object which I want to achieve dynamically:

columns: 
[
    {
        title: temporaryArray[0] + " ",
        field: gridArray[0].values + " "
    },
    {
        title: temporaryArray[1] + " ",
        field: gridArray[1].values + " "
    },
    {
        title: temporaryArray[2] + " ",
        field: gridArray[2].values + " "
    }
],

For example:

for( var x = 0; x < finalArray.length; x++ )
{
    myGrid[columns] = { temporaryArray[x]:finalArray[x] };
}

I want to generate the objects using a for loop to generate an array of objects inside the column array.

What I want to know is, whether this is possible to do dynamically? or just possible at all without hard coding it?

You can do it. Lets have the Titles stored in titleDefs and the field name in fieldDef. Then you should do:

// Title Definitions
var titleDefs = [
    "First Name", "Last Name", "Title"
];
// Field Definition
var fieldDefs = [
    "FirstName", "LastName", "Title"
];
// Lets compute column definition
var columnDefs = [];
for (var i = 0; i < titleDefs.length; i++) {
    columnDefs.push({ title : titleDefs[i], field: fieldDefs[i] });
}
// Now, create the grid using columnDefs as argument
var grid = $("#grid").kendoGrid({
    dataSource: {
        data    : dataArray,
        pageSize: 10
    },
    columns   : columnDefs
}).data("kendoGrid");

NOTE: In this example I've defined a DataSource that is a JavaScript array in memory but you can get the data from a server changing the DataSource definition.

NOTE: In your code, you were adding extra white space to the title definition and that is not correct: column definitions are JavaScript code and not strings so you don't have to format it as you were going to display it.