Wyświetlenie danych pobranych przez API Ajax'em

Witam

Mam problem chciałbym wyświetlić na stronie dane pobrane przez API ale gdzieś robię błąd. Czy możecie mi pomóc? https://jsfiddle.net/gt1ofujm/5/

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?q=London", function(result){
        $("#city").text(result.name);
        });
    });
   });
});
 </script>
   </head>
 <body>

<button>Get JSON data</button>

<div id="city"></div>

</body>
</html>
cod 401

message "Invalid API key. Please see http://openweathermap.org/faq#error401 for more info."
1 polubienie

Czyli w czym jest problem? Ta ścieżka API jest błędna?

Potrzebujesz chyba klucza.

Doc
Cennik

Dodatkowo w linii 7 javascript jest błąd:

obraz (Unrecoverable syntax error.)

Raczej 4programmers.net, bo tutaj to możesz się nie doczekać.