How to filter API values based on user input using jQuery

Question

How do I change the city(q) equals London to New York, based on user input field?

Scenario: User enter the city name and temperature will be displayed according to the city name.

 $.getJSON('https://api.openweathermap.org/data/2.5/weather?q=London&units=metric&appid={key}', function(data){


});

I tried the below code. but couldn't get the expected result.

$(function(){

$(".submit_btn").on('click', function(){
    var city = $("#city_name").val();

    $.getJSON('https://api.openweathermap.org/data/2.5/weather?q={city}&units=metric&appid={key}', function(data){

    var temp = `Temperature: ${data.main.temp} degrees Celsius`

    $(".w1").text(temp);



    });


});
});

Answer 1

Finally, it worked as follows;

$.getJSON(`https://api.openweathermap.org/data/2.5/weather?q=${city}&units=metric&appid={key}`, function(info){

var temp = `Temperature: ${info.main.temp} degrees Celsius`

$(".w1").text(temp);
});

Solution: Add backticks (`) to either side of the URL.