I'm trying to fetch and parse json data so I could output it to a blank HTML file. The problem that keeps occurring to me is that if I fetch the data and parse it I get a Uncaught TypeError: Cannot read property 'SOCENGPRE' of undefined error. If I fetch the json data in dataType: "text" format I get the XMLHttpRequest cannot load <api url> No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. error. The website is on a local machine and I cannot edit the server to be cross-platformed because of person reasons. The code looks like this :
var myDataVar;
function main() {
    $.ajax({
        url: "http://api&leagues=SOCENGPRE&format=jsonp&callback=?",
        dataType: "json",
        success: function (data) {
            myDataVar = $.parseJSON(data);
            getUpcomingFixtures();
        }
    });
}
function getUpcomingFixtures() {
    for (var i = 0; i <= myDataVar.SOCENGPRE.fixtures.length - 1; i++) {
        console.log(myDataVar.SOCENGPRE.fixtures[i].id);
        console.log(myDataVar.SOCENGPRE.fixtures[i].home_team + " vs " + myDataVar.SOCENGPRE.fixtures[i].away_team);
    }
}
An example of the data being fetched looks like this :
{
    "SOCENGPRE": {
        "league_name": "Barclays Premier League",
        "league_phid": null,
        "league_type": null,
        "fixtures": [{
            "id": "64714",
            "code": "SOCENGPRE",
            "event_slug": "west_ham-tottenham-1401290",
            "start": "1399117500",
            "home_team": "West Ham",
            "home_team_phid": null,
            "home_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t523.png",
            "home_team_short": "",
            "away_team": "Tottenham",
            "away_team_phid": null,
            "away_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t498.png",
            "away_team_short": "",
            "phid": null
        }, {
            "id": "64711",
            "code": "SOCENGPRE",
            "event_slug": "manchester_u-sunderland-1401286",
            "start": "1399125600",
            "home_team": "Manchester U",
            "home_team_phid": null,
            "home_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t20790.png",
            "home_team_short": "Man U",
            "away_team": "Sunderland",
            "away_team_phid": null,
            "away_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t382.png",
            "away_team_short": "",
            "phid": null
        }, {
            "id": "64712",
            "code": "SOCENGPRE",
            "event_slug": "stoke-fulham-1401288",
            "start": "1399125600",
            "home_team": "Stoke",
            "home_team_phid": null,
            "home_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t389.png",
            "home_team_short": "",
            "away_team": "Fulham",
            "away_team_phid": null,
            "away_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t379.png",
            "away_team_short": "",
            "phid": null
        }]
    }
}
My goal is to just fetch the fixture id and the two teams competing. Any clue what I'm doing wrong?
 
    