Как получить значение и изменить внешнюю переменную внутри обработчиков событий?

Question

У меня есть пустой массив. Заполнить его нужно, перейдя по некоторым ссылкам (только если значение текущего индекса еще не заполнено).

$(document).ready(function () {
    var genres_items = []; 

    $('.genre-fill-link').on('click', function() {
        var genre_index = $(this).data('g-index'); // get id of genre

        if(!genres_items[genre_index] { // want to check is this genre filled - get error, undefined variable 
            $.get('/get-genre-list/', {'genre-id', gener_index}, function(data) {  // if genre is not filled yet, want to get data by ajax
                gener_items[gener_index] = data;
            });
        }
    }

    console.log(genres_items); // get empty untouched array, even if links clicked
});

Как заполнить все элементы массива genre_items (каждый элемент один раз, нажав .genre-link )?

Как получитьзначения этого массива в других обработчиках и обратные вызовы после этого?!

Javascript сбил меня с толку = \ Пожалуйста, помогите

Answer 1

проверьте мои комментарии и попробуйте это:

$(document).ready(function () {

 var genres_items = []; 

 $('.genre-fill-link').on('click', function() {
    var genre_index = $(this).data('g-index'); // get id of genre
    if(!genres_items[genre_index] { // want to check is this genre filled - get error, undefined variable 
        $.get('/get-genre-list/', {'genre-id', gener_index}, function(data){  // if genre is not filled yet, want to get data by ajax
            genres_items[genre_index] = data;
            console.log(genres_items);
        });
     }
  }
});