jquery variable undefined but console shows it holds a value [duplicate]

The below image shows the result of console.log(data) in the following block of code, but console.log(data.result) returns undefined. At first I thought it was an array, but data[0].result and data[0] both show undefined. Also weird to me, if I put console.log(data.bitrate) or contentRange, or so on, they all return values.

This is the code I'm using it in, fileupload is from a library here

$(function() { var maxChunkSize = .5 * 1024 * 1024; //SET CHUNK SIZE HERE (.5 mb) $('.PicturesForm').fileupload({ maxChunkSize: maxChunkSize, url: 'forms/vehicle_Pictures.cfm', //URL WHERE FILE TO BE UPLOADED error: function(jqXHR, textStatus, errorThrown) { // Called for each failed chunk upload }, success: function(data, textStatus, jqXHR) { /*This event will be called on success of upload*/ var count = parseInt($(this.form).find('[name=counter]').val()) + 1; $(this.form).find('[name=counter]').val(count); }, submit: function(e, data) { /*This event will be called on submit here i am adding variable to form*/ $(this).find('[name=fileName]').val(data.originalFiles[0].name); $(this).find('[name=numberOfChunks]').val(Math.ceil(data.originalFiles[0].size / maxChunkSize)); $(this).find('[name=counter]').val('1'); }, progress: function(e, data) { console.log(data.bitrate); console.log(data); console.log(data[0]); console.log(data[0]); console.log(data[0].result); $(this).find('[name=progressBar]').html(data); } }); });