hi i have two dropdown dynamic one . my question is when i load my chrome page/refresh the page all the dropdown value are visible without selecting first dropdown option value <script> /* code for :select scheme, relative to department shown */ $('#department').on('change', function () { var departments = $('option:selected', this).attr('attr'); $("#schemes option").each(function (i) { if ($(this).attr('subattr') == departments) { $(this).css({ display: "block" }); } else { $(this).css({ display: "none" }); } }); }); </script> // this is the script for both the dropdown department is first dropdown id and schemes is second dropdown id //

Nota:
todas las opciones dinámicas funcionan bien, como cuando selecciono en el primer menú desplegable, se muestran sus valores relacionados, pero cuando actualizo la página y selecciono el segundo menú desplegable, todos los valores se muestran en el menú desplegable sin seleccionar el primer menú desplegable y no estoy en exceso según la opción seleccionada tanto en el menú desplegable cuando actualizo la página

gracias de antemano no puedo obtener respuesta por favor ayúdenme