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

Question

Привет всем, у меня есть вопрос, такой вопрос

Я создаю одну функцию, когда выбираю Тахун Аджаран и выбираю семестр , как изображение ниже, все страницыс выпадающим списком tahun ajaran и semester Выбрано значение Selected зависит, когда я перезагружаю страницу, оставляя значение выбранным, это то, что я хочу

Я использую функцию localalstorage, как это

$("#masterTahunAjaran").on('change', function() {
  localStorage['myKey'] =  this.value;  // only strings

});

скомпилировать код, подобный этому

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
 $('document').ready(function() {
    var masterTahun = document.getElementById("masterTahunAjaran")
        for (var x = 0; x < masterTahun.length; x++) {
                if ( localStorage['myKey'] == masterTahun[x].options[x].value) {
                     masterTahun.selectedIndex = x;
                           }
}
 });
$("#masterTahunAjaran").on('change', function() {
      localStorage['myKey'] =  this.value;  // only strings
}); 

это мой код HTML

<div class="row">
                    <div class="col-md-12">
                        <select class="form-control" name="masterTahunAjaran" id="masterTahunAjaran">
                            <option value="0" selected disabled>Pilih Tahun Ajaran</option>
                            @foreach ($tahun_ajaran as $value)
                            <option value="{{$value->tahun_ajaran}}">{{$value->tahun_ajaran}} /
                                {{$value->tahun_ajaran + 1}}</option>
                            @endforeach


                        </select></div>
        </li>
        <li>
            <div class="row">
                <div class="col-md-12">
                    <select class="form-control" name="masterSemester" id="masterSemester">
                        <option value="0" selected disabled>Pilih Semester</option>
                        <option value="1">Ganjil</option>
                        <option value="2">Genap</option>
                    </select>

                </div>

этот код работает ,, НО код выше только что выбранный один идентификатор is masterTahunAjaran , как выбрать 2 id это masterTahunAjaran и masterSemester ?? Итак, когда я выбрал оба, Тахун Аджаран Дан Семестр оба выбран, как быть так ??

Я пытался использовать document.querySelectorAll работает следующим образом:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
 $('document').ready(function() {
    var masterTahun = document.querySelectorAll("#masterTahunAjaran, #masterSemester")
        for (var x = 0; x < masterTahun.length; x++) {
                if ( localStorage['myKey'] == masterTahun[x].options[x].value) {
                     masterTahun.selectedIndex = x;
                           }
}
 });
$("#masterTahunAjaran, #masterSemester").on('change', function() {
      localStorage['myKey'] =  this.value;  // only strings
}); 

, но код не работает , выбранное раскрывающееся меню не выбирается при перезагрузке страницы, а не ошибка при проверке элемента, кто-нибудь, как узнать этофункция работает? спасибо, помогая.