【jQuery】複数のselectを用意して、jQueryが動かない時

問題のコード。

$(document).on('turbolinks:load',function(){

  $("#worker_list_num").change(function(){
    $("#select_form").submit();
  });
});

プルダウンを選択した時に動く記述にしたが、複数のプルダウンを用意したら一番最初の部分しか反応しない。

console.log()をつけて動きを確かめる。

$(document).on('turbolinks:load',function(){

  $("#worker_list_num").change(function(){
    // $("#select_form").submit();
    console.log($(this).val());
  });
});

左上のプルダウンしか動きません

解決法

$(document).on('turbolinks:load',function(){

  $(document).on("change","#worker_list_num",function(){
    console.log($(this).val());
  });
});

idに直接ではなく.on()で取得する記述にすると動くようになりました

左上以外のプルダウンも効くようになりました