JSFiddle - React, Tailwind, and code Playground

by martinsrodrigoaugusto806

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <title>JavaScript fills a Select</title>
</head>
<body>


 
  <select class="select-css"  id="list2" >    
                                
                                    <option value="14610-1-CONTRATOS                     " >
                                                14610-1-CONTRATOS                     
                                    </option>                                   
                                    
                                    <option value="14610-2-CAROLINA MELLO                " >
                                                14610-2-CAROLINA MELLO                
                                    </option>                                   
                                    
                                    <option value="14610-3-telefonia                     " >
                                                14610-3-telefonia                     
                                    </option>                                   
                                    
                                    <option value="14610-4-PEDRO MAFFIA-COORD.GERAL CIENC" >
                                                14610-4-PEDRO MAFFIA-COORD.GERAL CIENC
                                    </option>                                   
                                    
                                    <option value="14958-1-MARCUS VINICIUS               " >
                                                14958-1-MARCUS VINICIUS               
                                    </option>                                   
                                    
                                    <option value="14958-2-Carolina Mello                " >
                                                14958-2-Carolina Mello                
                                    </option>                                   
                                    
                           ...

JavaScript

//pega o select
var select = document.getElementById("list2");
//cria uma lista vazia 
var vlroption = []


//le o select e pega somente os valores e adiciona em uma nova lista
console.log("PEGA VALORES DO SELECT")
for (i = 0; i < select.length; i = i + 1) {
	//Pega os valores do select e armazena em uma lista
   vlroption.push(select.options[i].value.toUpperCase())
   
}

//Limpa a Lista original
document.querySelectorAll('#list2 option').forEach(option => option.remove())

//le os dados que foram armazenados e insere na lista apos validar o contrato
console.log("Lista Preenchida")
for (k =0; k < vlroption.length; k = k + 1){
		      //Informa o numero do contrato para validacao
    		  if(vlroption[k].match("14610")){
   			  //console.log(vlroption[k])
          //remove o contrato da exibição do contato
          vlroption[k] = vlroption[k].replace("14610-", "");
          //insere os itens no select option
          var option = new Option(vlroption[k], vlroption[k]);
          //seleciona o select 
    			var select = document.getElementById("list2");
          //insere o item dentro do select novamente
    			select.add(option);
  }
}