JSFiddle - React, Tailwind, and code Playground

by JCMais

HTML

<script src="http://www.andrewd.com.br/web-files/js/jquery.mascara.js"></script>
<select name="opt_tipo_contato[]" id="opt_tipo_contato_0">
    <option value="1">CEP</option>
    <option value="2">TELEFONE</option>
</select>
<input type="text" name="inp_tipo_contato[]" id="inp_tipo_contato_0" />

<br />

<select name="opt_tipo_contato[]" id="opt_tipo_contato_1">
    <option value="1">CEP</option>
    <option value="2">TELEFONE</option>
</select>
<input type="text" name="inp_tipo_contato[]" id="inp_tipo_contato_1" />

<br />
<select name="opt_tipo_contato[]" id="opt_tipo_contato_2">
    <option value="1">CEP</option>
    <option value="2">TELEFONE</option>
</select>
<input type="text" name="inp_tipo_contato[]" id="inp_tipo_contato_2" />

<br />
<select name="opt_tipo_contato[]" id="opt_tipo_contato_3">
    <option value="1">CEP</option>
    <option value="2">TELEFONE</option>
</select>
<input type="text" name="inp_tipo_contato[]" id="inp_tipo_contato_3" />

<br /> <br />

Classe cep = mascara cep: <input type="text" name="avulso" class="cep" />

JavaScript

$("select[name='opt_tipo_contato[]']").change(function(){
   
    //não declare variaveis sem usar var, pois do contrário as mesmas ficam no escopo global, e globals são EVIL
    var $this = $(this), //efetue cache do elemento, para evitar outras requisições ao DOM sem necessidade
        tipoContato    = $this.val(),
        idContatoOpt   = $this.prop('id'); //id é uma propriedade do elemento, use prop ao invés de attr
    
    if(!tipoContato){
        return false;
    }
    
    var optValor = idContatoOpt.split("_"),
        inputId  = 'inp_tipo_contato_'+optValor[3],
        $input   = $('#' + inputId),
        inpClass = $this.find('option:selected').text().toLowerCase();
    
    console.log(inpClass, $this.find('option:selected').text());
    
    $input.removeClass().addClass(inpClass);
    
    $("input.cep").mask("99.999-999");
    $("input.fone").mask("(99) 9999-9999");
});