Javascript input select option with data-select

I have the following javascript code and create add data-select attribute

Something like this but create the select in javascript link

As in this option in php but in javascript

 echo'<option data-select="'.$distrito.'" value= "'.$registoq['id_escalao'].'">'.$registoq['id_escalao'].' </option>';  

 // Celula 2 -Escalão
    // Cria um <td>
    var diasem = row.insertCell(2);
     // Cria o select
    var esc = document.createElement('select');
    // Da o nome ao select
    esc.name = 'escalao[]';
    esc.className = "form-control";
    esc.options[0] = new Option("iniciados", "1");
         esc.options[1] = new Option("juniores", "2");
 esc.options[2] = new Option("seniores", "3);
    diasem.appendChild(esc);

Is this the code that I use to only appear the steps associated with that modality, do I need data-select or is there another way? is that I can not create the data-select attribute in javascript

var selects = $('select[name="escalao[]"] option');
$('select[name="modalidade[]"]').on('change', function () {
var select = this.value;
var novoSelect = selects.filter(function () {
    return $(this).data('select') == select;
});
$('select[name="escalao[]"]').html(novoSelect);
});