title: Display JSON object in DIV using jQuery
body: <p>Can anybody tell me what I am doing wrong here? I am retrieving a JSON object using ESPN API, however I am unable to make it display in a DIV on my HTML page.</p>
  
  <p><strong>My jQuery</strong></p>
  
  <pre><code>$.ajax({
      type: "GET",
      dataType: "json",
      data: " ",
      url: 'http://api.espn.com/v1/sports/basketball/nba/teams/16?enable=stats,leaders&amp;seasontype=2&amp;_accept=text/json&amp;apikey=XXXXX2457896',
      success: function(data) {
        $('#result').html(data);
        console.log('Load was performed.');
      }
  });
  </code></pre>
  
  <p><strong>My Returned JSON</strong></p>
  
  <pre>{
    "sports": [
      {
        "name": "basketball",
        "id": 40,
        "leagues": [
          {
            "id": 46,
            "groupId": 7,
            "name": "National Basketball Assoc.",
            "abbreviation": "NBA",
            "teams": [
              {
                "id": 16,
                "location": "Minnesota",
                "name": "Timberwolves",
                "abbreviation": "MIN",
                "color": "0E3764",
                "links": {
                  "api": {
                    "teams": {
                      "href": "http://api.espn.com/v1/sports/basketball/nba/teams/16"
                    },
                    "news": {
                      "href": "http://api.espn.com/v1/sports/basketball/nba/teams/16/news"
                    },
                    "notes": {
                      "href": "http://api.espn.com/v1/sports/basketball/nba/teams/16/news/notes"
                    }
                  },
                  "web": {
                    "teams": {
                      "href": "http://espn.go.com/nba/team/_/name/min/minnesota-timberwolves?ex_cid=espnapi_public"
                    }
                  },
                  "mobile": {
                    "teams": {
                      "href": "http://m.espn.go.com/nba/clubhouse?teamId=16&ex_cid=espnapi_public"
                    }
                  }
                }
              }
            ]
          }
        ]
      }
    ],
    "resultsOffset": 0,
    "resultsLimit": 50,
    "resultsCount": 1,
    "timestamp": "2012-07-03T16:33:07Z",
    "status": "success"
  }</pre>
  
  <p>The request works fine and everything. I just can't figure out how to get the data to appear on my HTML page.I thought I could just use the <code>.html()</code> property, but I must be missing something.</p>
  
  <p>Thanks for your help..</p>