I have the following select in html
<span class="IWLABEL11CSS" id="IWLABEL7">Órgão: </span>
<select name="Distrito" size="1" width="180" class="COMBODISTCSS" id="COMBOFAB" tabindex="1">
<option value="01">Gabinete do Prefeito</option>
<option value="02">Coordenadoria de Governo e Comunicação Social</option>
<option value="03">Secertaria Municipal de Planejamento</option>
<option value="04">Procuradoria Jurídica</option>
<option value="05">Ouvidoria Municipal</option>
<option value="06">Secretaria Municipal de Administração</option>
<option value="07">Secretaria Municipal da Fazenda</option>
<option value="08">Auditoria Interna</option>
<option value="09">Secretaria Municipal de Obras</option>
<option value="10">Secretaria Municipal de Desenvolvimento Urbano e Meio Ambiente</option>
<option value="11">Secretaria Municipal de Educação</option>
<option value="12">Secretaria Municipal de Esportes e Lazer</option>
<option value="13">Secretaria Municipal de Saúde</option>
<option value="14">Secretaria Municipal de Desenvolvimento Econômico</option>
<option value="15">Secretaria Municipal de Ação Social</option>
<option value="16">Secretaria Municipal Agricultura</option>
<option value="17">Câmara Municipalde Itabira</option>
<option value="18">Fundação Cultural Carlos Drummond de Andrade</option>
</select>
<span class="IWLABEL11CSS" id="IWLABEL7">Unidade: </span>
<select name="Concelho" size="1" width="195" class="COMBOCONCCSS" id="COMBOCID" tabindex="1">
<option data-distrito="01" value="01">Gabinete do Prefeito</option>
<option data-distrito="01" value="02">Departamento de Assuntos Institucionais</option>
<option data-distrito="02" value="03">Gabinete da Coordenadoria de Governo e Comunicação Social</option>
<option data-distrito="02" value="04">Departamento de Comunicação Social</option>
<option data-distrito="02" value="05">Administração Distrital de Ipoema</option>
<option data-distrito="02" value="06">Administração Distrital de Senhora do Carmo</option>
<option data-distrito="03" value="07">Gabinete da Secretaria Municipal de Planejamento</option>
<option data-distrito="03" value="08">Departamento de Orçamento Municipal</option>
<option data-distrito="03" value="09">Departamento de Estudos e Avaliação</option>
<option data-distrito="03" value="10">Departamento de Programas e Projetos</option>
<option data-distrito="04" value="11">Procuradoria Jurídica</option>
<option data-distrito="05" value="12">Ouvidoria Municipal</option>
<option data-distrito="06" value="13">Gabineet ad Secretaria de Administração</option>
<option data-distrito="06" value="14">Departamento de ecursos Humanos</option>
<option data-distrito="06" value="15">Departamento de Contratos</option>
<option data-distrito="06" value="16">Departamento de Material e Patrimônio</option>
<option data-distrito="06" value="17">Departamento de Comunicação e Serviços Gerais</option>
<option data-distrito="06" value="18">Departamento de Informática</option>
<option data-distrito="07" value="19">Gabinete da Secretaria Municipal da Fazenda</option>
<option data-distrito="07" value="20">Departamento de Tributação</option>
<option data-distrito="07" value="21">Departamento de Finanças</option>
<option data-distrito="08" value="22">Gabinete de Auditoria Interna</option>
<option data-distrito="09" value="23">Gabinete da Secretaria municipal de Obras</option>
<option data-distrito="09" value="24">Departamento de Obras</option>
<option data-distrito="09" value="25">Departamento de Apoio Administrativo</option>
<option data-distrito="09" value="26">Departamento de Estradas e Vias</option>
<option data-distrito="10" value="27">Gabinete da Secretaria Municipal de Desenvolvimento Urbano e Meio Ambiente</option>
<option data-distrito="10" value="28">Departamento de Urbanismo</option>
<option data-distrito="10" value="29">Departamento de Meio Ambiente</option>
<option data-distrito="10" value="30">Departamento de Serviços Urbanos</option>
<option data-distrito="10" value="31">Departamento de Transportes e Trafegos</option>
<option data-distrito="11" value="32">Gabinete da Secretaria Municipal da Educação</option>
<option data-distrito="11" value="33">Departamento de Apoio ao Educando</option>
<option data-distrito="11" value="34">Departamento de Administração Escolar</option>
<option data-distrito="12" value="35">Departamento Tecnico Pedagógico</option>
<option data-distrito="12" value="36">Gabinete da Secretaria Municipal de Esportes e Lazer</option>
<option data-distrito="12" value="37">Departamento de Esportes e Lazer</option>
<option data-distrito="13" value="38">Gabinete da Secretaria Municipal</option>
<option data-distrito="13" value="39">Departamento de Planejamento e Administração em Saúde</option>
<option data-distrito="13" value="40">Departamento de Ações em Saúde</option>
<option data-distrito="13" value="41">Departamento de Policlinica</option>
<option data-distrito="13" value="42">Departamento de Vigilancia em Saúde</option>
<option data-distrito="14" value="43">Gabinete da Secretaria Municipalde Desenvolvimento Econômico</option>
<option data-distrito="14" value="44">Departamento de Comércio e Turismo</option>
<option data-distrito="14" value="45">Departamento de Desenvolvimento Indutrial</option>
<option data-distrito="14" value="46">Departamento de Produção e Modernização Industrial</option>
<option data-distrito="15" value="47">Gabinete da Secretaria Municipal de Ação Social</option>
<option data-distrito="15" value="48">Departamento de Desenvolvimento Comunitário</option>
<option data-distrito="15" value="49">Departamento de Promoção Humana</option>
<option data-distrito="16" value="50">Gabinete da Secretaria Municipal de Agricultura e Abastecimento</option>
<option data-distrito="16" value="51">Departamento de Abastecimento</option>
<option data-distrito="16" value="52">Departamento de Fomento Agropecuario</option>
<option data-distrito="17" value="53">Câmara Municipal</option>
<option data-distrito="18" value="54">Fundação Cultural Carlos Drummond de Andrade</option>
</select>
var concelhos = $('select[name="Concelho"] option');
$('select[name="Distrito"]').on('change', function () {
var Distrito = this.value;
var novoSelect = concelhos.filter(function () {
return $(this).data('distrito') === Distrito;
});
$('select[name="Concelho"]').html(novoSelect);
});
But when I select from the 10th option on the first select, the second does not work.