推送在jquery中是未定义的

我试图将“像这样”的特定配方推送到一个名为saved_recipe的新数组中。但是我推的值变为未定义，有人知道为什么吗？

假设

GetRecipe\u Arr

的长度为3

在下面的行中

var saved_recipe = [];
$.ajax({
  url: "https://api.spoonacular.com/recipes/complexSearch",
  data: "apiKey=" + apiKey + "&query=" + query 
  async: 'true',
  success: GetReci
});

function GetReci(response) {
  console.log(response)
  var r = "";
  var i = 0;
  var GetRecipe_Arr = response.results;
  $.each(GetRecipe_Arr, function(index, value) {
    var title = GetRecipe_Arr[i].title;

    i = i + 1;
  })

  console.log(saved_recipe);
  $(document).on("tap", "#saved_recipe", function(e) {
    saved_recipe.push(GetRecipe_Arr[i]);
    console.log(saved_recipe)
  });


  $('#recipeoutput').html(reci);
}

索引

i

引用3，但

GetRecipe\u Arr[3]

将

未定义

循环结束后，您正试图访问
i

console.log(saved_recipe);
$(document).on("tap","#saved_recipe",function(e){
  saved_recipe.push(GetRecipe_Arr[i]);
  console.log(saved_recipe)
});