Error in classlist.toggle

Question

I have a problem adding classes via js, for some inputs are added the Clases I want, for others not, how can I proceed ?.

PS: The function to set attributes in these inputs is also not working.

---

              function appendChildSeveralTimes(parent, child, times) {
                    this.cloneChild = child;
                    this.parent = parent;
                    this.times = times;
                    var tempInput = 
                    document.createElement('input'),tempChild;
                    var x = 0,finalElement;
                  
                    while (x < times) {
                        
                        
                        tempInput.classList.toggle('inputTable');
                        tempInput.classList.toggle('mr-auto');
                        tempInput.classList.toggle('form-control');
                        var inputClone = tempInput.cloneNode();
                            
                        tempChild = child.cloneNode();
                        tempChild.appendChild(inputClone);
                        tempChild.classList.add('nota'+x);
                        
                        parent.classList.toggle('d-flex');
                        parent.classList.toggle('w-100');
                        parent.appendChild(tempChild)
                        x++;
                        tempChild = null;

                    };
                  
                  return parent;
                    
                  

              };
              
              function placeHolders(parent){
                    var inputs = parent.querySelector('.nota0');
                  inputs.classList.toggle('nome');
                  inputs.classList.toggle('nota0');
                  inputs.setAttribute('placeholder', 'Insira o Nome do aluno');
              }
              
              var $btnAddAluno = document.getElementById('addAluno');
              var $tabelAlunos = document.getElementById('tableNotas');
              
              
              $btnAddAluno.addEventListener('click',function(){
                  var trsFinal,$tempTr,$tempTd;
                  
                  $tempTr = document.createElement('tr');
                  $tempTd = document.createElement('td');
                  
                  trsFinal = appendChildSeveralTimes($tempTr,$tempTd,5)
                  
                  placeHolders(trsFinal);
                  
                  $tabelAlunos.appendChild(trsFinal);
                  
                  
                  
                  
              })

Answer 1

To add classes use .classList.add() instead of .classList.toggle(). This is because the second will add and remove the classes of the elements every time in the loop while in alternation, that is, the first input will have the classes, the second no, the third yes, the fourth no and the fifth yes.

The function of .toggle() is to add/remove class each time it is called.

The solution is to exchange all toggle for add.