Change one Select from another by triggering the second’s "onChange" event using JS

Question

I have two problems, I made a function to check by the class of selects all your children in the block, so when I change the first option has to change all the others in cascade. Problems:

(1) -> how it is inserting the "Selected" it is not triggering the "onChange" of the product

(2) -> when I change the first time it applies to all selects, but if I keep switching between the options it only changes the ones that have not yet been selected (it only works 1 time)

JS with my function

selectDepositoPadrao: function(event){
    // capturar o evento
    console.log(event.val());
    // pegar somente o bloco para poder alterar por classe cada option
    $(event).closest('.form-std')
        // buscando a mesma classe em comun nos depósitos
        .find('.depositoDestino')
        .each(function(idx,item){
            //ignora o primeiro
            if(idx) {
                //pega os values dos options dos selects
                $(item).children().each(function(idxOpt, itemOpt){
                    if($(itemOpt).val() === $(event).val()){

                        $(itemOpt).attr('selected', 'selected')
                    }
                })
            }
        });
},

Form that triggers it

<select name="depositoPadraoCel" id="depositoPadraoCel" onchange="FormularioTransferencia.selectDepositoPadrao($(this))"
        class="depositoDestino">
</select>

Onchange I want to trigger that is not triggering (Lade do Laravel)

     <select class="depositoDestino" 
name = "celular[{{$inputId}}][deposito_destino]" 
@if(isset($celular)) id="depositoDestinoCelular{{$celular->estoque_celular->es_id}}" 
    onchange="obtemProdutoStatusDoDeposito('{{$celular->estoque_celular->es_id}}', 'Celular')" @endif>
     <option value="" selected>Selecione o deposito</option>
      @if(isset($depositos))
         @foreach($depositos as $deposito)
         <option @if(isset($celular) && $deposito->id == $celular->deposito_destino_id) selected 
      @endif value="{{$deposito->id}}">
         {{$deposito->nome}}
     </option>
       @endforeach
        @endif
     </select>

I’m trying to find out if I have to use only the JS change by applying it to scrolling through indices instead of adding the "Selected" straight to I don’t know if this is the right way.

Answer 1

function selectDepositoPadrao(event){
    $(event).closest('.form-std')
        .find('.deposito')
        .each(function(idx,item){
            $(item).children().each(function(idxOpt, itemOpt){
               
                if ($(itemOpt).val() !== $(event).val()){
                    $(itemOpt).removeAttr('selected');
                } else {
                    $(itemOpt).removeAttr('selected');
                    $(itemOpt).attr('selected','selected');
                }
                $(itemOpt).parent().trigger('change');
            });
        });
}

I managed to do this way, selecting and performing the Rigger to trigger the onchange of the other select, I’m only now with another problem regarding to select the item 1 then I go to the 2 and when I return to the 1, it plays correctly the "Selected" html but does not change the option, back to the first value-free option.