http is being forced to https in ajax api url

I am making API calls using this URL:
http://api.geonames.org/postalCodeLookupJSON?postalcode=” + zipCode + “&country=CA&username=347827

When i run my code locally the api response is successful and returns the result but the problem is that when I uploaded my code to my online website and then when I open the page and make Api call then URL is being changed to HTTPS automatically and API response is error,
Can anyone tell me how can I solve this problem here is my code:

$.ajax({
          url:
            "http://api.geonames.org/postalCodeLookupJSON?postalcode=" +
            zipCode +
            "&country=CA&username=coderpak",
          dataType: "jsonp",
          success: function (response) {
            if (
              typeof response.postalcodes !== "undefined" &&
              response.postalcodes.length > 0
            ) {
              $("select#state").val(response.postalcodes[0]["adminCode1"]);

              $(".error-msg").hide();
              $("#response").html(
                "<h3>Congratulations! <br/> Programs are available in your area</h3>"
              );
              setTimeout(() => {
                $("#step" + currentStep).hide();
                currentStep++;
                $("#step" + currentStep).show();
                $("#step" + currentStep)
                .find("input, select, textarea")
                .prop("disabled", false);
                if (currentStep + 1 == totalSteps) {
                  $(".btn-next").hide();
                  $(".btn-submit").show();
                }
              }, 1000);
            } else {
              $("#post_code,.error-msg").show();
              $(".error-msg").text("Enter a valid postal code");
            }
          },

          error: function (response) {
            $("#post_code").show();
            $("#response").html("<p class='text-danger'>Failed! Try again</p>");
            console.log(response);
          },
        });