javascript - simple jquery selector doesn't work in chrome -

so have script on (http://clubmoving-wp.punct.ro/):

$('#schedulebox .selectcity select option').click(function() {         var citytoshow = $(this).attr('value');          switch(citytoshow) {             case '0':                 $('.bucuresti, .cluj, .otopeni, .iasi').show();                 break;                case '1':                 $('.cluj, .otopeni, .iasi').hide();                 $('.bucuresti').show();                 break;             case '2':                 $('.cluj, .bucuresti, .iasi').hide();                 $('.otopeni').show();                 break;             case '3':                 $('.bucuresti, .otopeni, .iasi').hide();                 $('.cluj').show();                 break;             case '4':                 $('.bucuresti, .otopeni, .cluj').hide();                 $('.iasi').show();                 break;         };     }); 

that needs show or hide activity city. works fine in ff no chrome

the actual script in gears.js

thank you

$('#schedulebox').on('change', '.selectcity', (function() {         var citytoshow = $('option:selected', this).val();          switch(citytoshow) {             case '0':                 $('.bucuresti, .cluj, .otopeni, .iasi').show();                 break;                case '1':                 $('.cluj, .otopeni, .iasi').hide();                 $('.bucuresti').show();                 break;             case '2':                 $('.cluj, .bucuresti, .iasi').hide();                 $('.otopeni').show();                 break;             case '3':                 $('.bucuresti, .otopeni, .iasi').hide();                 $('.cluj').show();                 break;             case '4':                 $('.bucuresti, .otopeni, .cluj').hide();                 $('.iasi').show();                 break;         };     }); 

make following changes , should go!