the button element not responding

Question

please tell me whats wrong with my jquery code (it looks that everything is oky but its still not working !)
the button generate is not working and nothing happen when i click it !

ps : i have searched about this problem everywhere and i can't find the soulition also i treid by myself and same problem

thanks

$('#meta_mal_api_button').click(function(e) {
	e.preventDefault();

  var valMALID = $('input[name=meta_mal_api_input]').get(0).value;

  var languange = "<?php echo $langu; ?>";

  var target = document.URL;
  $.getJSON("https://mal.developersidn.com/anime/?id=https://myanimelist.net/anime/" + valMALID + languange, function(json) {
    $.each(json, function(key, val) {

      var valTitle = "";
      if (key == "<?php echo $titleml; ?>") {
        valTitle += "" + val + "";
        $('input[name=dev_title]').val(valTitle);
        $("input[name=post_title]").val(valTitle);
      }

      var valEnglish = "";
      if (key == "english") {
        valEnglish += "" + val + "";
        $("input[name=dev_english]").val(valEnglish);
      }

      var valJapanese = "";
      if (key == "japanese") {
        valJapanese += "" + val + "";
        $("input[name=dev_japanese]").val(valJapanese);
      }

      var valStatus = "";
      if (key == "status") {
        valStatus += "" + val + "";
        $("select[name=dev_status]").val(valStatus);
      }

      var valType = "";
      if (key == "type") {
        valType += "" + val + "";
        $("select[name=dev_type]").val(valType);
      }

      var valDuration = "";
      if (key == "duration") {
        valDuration += "" + val + "";
        $("input[name=dev_duration]").val(valDuration);
      }

      var valDuration = "";
      if (key == "duration") {
        valDuration += "" + val + "";
        $("input[name=dev_duration]").val(valDuration);
      }


      var valProducer = "";
      if (key == "producers") {
        valProducer += "" + val + "";
        $("input#new-tag-producers").val(valProducer);
      }

      <?php if($catmal == '1') { ?>
      var valTitleCat = "";
      if (key == "<?php echo $titleml; ?>") {
        valTitleCat += "" + val + "";
        $('input#newcategory').val(valTitleCat);
        $("input#category-add-submit").click();
      }

      <?php } ?>
      var valScore = "";
      if (key == "score") {
        valScore += "" + val + "";
        $("input[name=dev_score]").val(valScore);
      }

      var valDate = "";
      if (key == "aired") {
        valDate += "" + val + "";
        $("input[name=dev_date]").val(valDate);
      }

      var valDate = "";
      if (key == "aired") {
        valDate += "" + val + "";
        $("input[name=dev_date]").val(valDate);
      }

      var valTrailer = "";
      if (key == "pv") {
        valTrailer += "" + val + "";
        $("input[name=dev_trailer]").val(valTrailer);
      }

      var valRating = "";
      if (key == "score") {
        valRating += "" + val + "";
        $("input[name=dev_rating]").val(valRating);
      }

      var valUsers = "";
      if (key == "users") {
        valUsers += "" + val + "";
        $("input[name=dev_users]").val(valUsers);
      }


      var valSource = "";
      if (key == "source") {
        valSource += "" + val + "";
        $("input[name=dev_source]").val(valSource);
      }


      var valTotalEpisode = "";
      if (key == "episodes") {
        valTotalEpisode += "" + val + "";
        $("input[name=dev_episode]").val(valTotalEpisode);
      }

      var valSeason = "";
      if (key == "premiered") {
        valSeason += "" + val + "";
        $('input#new-tag-season').val(valSeason);
      }

      var valGenre = "";
      if (key == "genres") {
        valGenre += "" + val + "";
        $('input#new-tag-genre').val(valGenre);
      }

      var valStudio = "";
      if (key == "studios") {
        valStudio += "" + val + "";
        $('input#new-tag-studio').val(valStudio);
      }



      var valImg = "";
      var valAutoupload = "1";
      if (key == "image") {
        valImg += "" + val + "";
        // Insert image using ajax
        if (valAutoupload == '<?php echo $autoupload; ?>') {
          var poster = valImg;
          //alert(poster);
          $.ajax({
            type: "POST",
            url: target,
            data: {
              'poster_url': poster,
            },
            success: function(response) {
              $("input[name=dev_featured]").val(response);
            }
          });
        } else {
          $("input[name=dev_featured]").val(valImg);
        }
      }
      var valDesc = "";
      if (key == "synopsis") {
        var output = val.replace(/\n/g, "<br />");
        valDesc += "" + output + "";
        if (typeof tinyMCE != "undefined") {
          var editor_id = wpActiveEditor;
          if ($('#wp-' + editor_id + '-wrap').hasClass('tmce-active') && tinyMCE.get(editor_id)) {
            tinyMCE.get(editor_id).setContent(valDesc);
          } else {
            $("textarea[name=content]").val(valDesc);
          }
        }
      }

    });
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="rwmb-clone rwmb-text-clone">
  <input size="30" type="text" id="meta_mal_api_input" value="28249" class="rwmb-text " name="meta_mal_api_input">
  <a href="#" class="button-primary" id="meta_mal_api_button">Generate</a>
</div>

Answer 1

Add your jquery code in document ready block.

  $(document).ready(function () {

    });

The element is not loaded into the DOM when the click function is bound to the element.

Answer 2

Since you are using an anchor tag as your button, you should be preventing the default behavior of the link before adding your custom functionality:

$('#meta_mal_api_button').click(function(e) {
    e.preventDefault();
    ...
});

Working sample code:

$('#meta_mal_api_button').click(function(e) {
  e.preventDefault();
  alert('Button clicked');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="rwmb-clone rwmb-text-clone">
  <input size="30" type="text" id="meta_mal_api_input" value="28249" class="rwmb-text " name="meta_mal_api_input">
  <a href="#" class="button-primary" id="meta_mal_api_button">Generate</a>
</div>