PHP/cURL - GeoNames - Oceans API - Cannot get response from API

one text

I've already posted on here about another issue I had with a GeoNames api (this issue was resolved) but now I have another issue with another GeoNames api http://api.geonames.org/oceanJSON?

It takes the exact same parameters as the timezone api which is working but ocean just will not work.

The only thing I can think of it that it's something to do with the object returned being within another object(perhaps?) but I'm not sure.

This is the return from http://api.geonames.org/oceanJSON?lat=40.7&lng=-43.9&username=t90moy

{"ocean":{"distance":"0","geonameId":3411923,"name":"North Atlantic Ocean"}}

and this is how I am trying to access the "name" element

$('#ocean').html(result.data.ocean.name);

Again any help would be much appreciated. my full code is - index.html

    <!DOCTYPE html>
<html>
    <head>
    </head>

    <body>
        <table>
            <tr>
                <th>API Name</th>
                <th>API Description</th>
                <th></th>
            </tr>
            <tr>
                <td>1. Timezone</td>
                <td><p id="tabledescriptions">Description</p>
                    <p>The timezone at the given longtitute and latitude.</p>
                    <label for="longitude">Enter the Longitude: </label>
                    <input type="text" id="long" name="longitude">
                    <label for="latitude">Enter the Latitude: </label>
                    <input type="text" id="lat" name="latitude">
                </td>
                <td><button id="buttonrun1">Submit</button></td>
            </tr>
            <tr>
                <td>2. Ocean Info</td>
                <td><p id="tabledescriptions">Description</p>
                    <p>The nearest Ocean to the longitude & latitude given above.</p>
                    <label for="longitude1">Enter the Longitude: </label>
                    <input type="text" id="long1" name="longitude1">
                    <label for="latitude1">Enter the Latitude: </label>
                    <input type="text" id="lat1" name="latitude1">
                </td>
                <td><button id="buttonrun2">Submit 2</button></td>
            </tr>
            <tr>
                <td>2. Name</td>
                <td>Description</td>
                <td><button id="buttonrun3">Submit</button></td>
            </tr>
            <tr>
                <td><p id="tabledescriptions">Result of Timezone API Call</p></td>
                <td><p id="sunrise"></p>
                    <p id="sunset"></p>
                    <p id="country"></p>
                    <p id="timeZone"></p>
                    <p id="timeNow"></p>
                </td>
            </tr>
            <tr>
                <td><p id="tabledescriptions">Result of Ocean API Call</p></td>
                <td><p id="ocean"></p>
                </td>
            </tr>
        </table>
        <script type="application/javascript" src="libs/js/jquery-2.2.3.min.js">`</script>`
        <script type="application/javascript" src="libs/js/main.js"></script>
    </body>

    <footer>


    </footer>
</html>

main.js

    $('#buttonrun1').on('click', function() {

    $.ajax({
      url: "libs/php/getTimeZone.php",
      type: 'POST',
      dataType: 'json',
      data: {
        longitude: $('#long').val(),
        latitude: $('#lat').val()
      },
      success: function(result) {
  
        console.log(JSON.stringify(result));
  
        if (result.status.name == "ok") {
  
          $('#sunrise').html(result.data.sunrise);
          $('#sunset').html(result.data.sunset);
          $('#country').html(result.data.countryName);
          $('#timeZone').html(result.data.timezoneId);
          $('#timeNow').html(result.data.time);
  
        }
      
      },
      error: function(jqXHR, textStatus, errorThrown) {
        // your error code
      }
    }); 
  
});

$('#buttonrun2').on('click', function() {

  $.ajax({
    url: "libs/php/getOcean.php",
    type: 'POST',
    dataType: 'json',
    data: {
      longitudea: $('#long1').val(),
      latitudea: $('#lat1').val()
    },
    success: function(result) {

      console.log(JSON.stringify(result));
  
    if (result.status.name == "ok") {

        $('#ocean').html(result.data.ocean.name);
  

      }
    
    },
    error: function(jqXHR, textStatus, errorThrown) {
      // your error code
    }
  }); 

});

getOcean.php

<?php

    // remove for production

    ini_set('display_errors', 'On');
    error_reporting(E_ALL);

    $executionStartTime = microtime(true);

    $url='http://api.geonames.org/oceanJSON?lat=' . $_REQUEST['latitudea'] . '&lng=' . $_REQUEST['longitudea'] . '&username=t90moy';

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_URL,$url);

    $result=curl_exec($ch);

    curl_close($ch);

    $decode = json_decode($result,true);    

    $output['status']['code'] = "200";
    $output['status']['name'] = "ok";
    $output['status']['description'] = "success";
    $output['status']['returnedIn'] = intval((microtime(true) - $executionStartTime) * 1000) . " ms";
    $output['data'] = $decode;
    
    header('Content-Type: application/json; charset=UTF-8');

    echo json_encode($output); 

?>

Source