Problema innerHTML e cambio CSS

[Alifuma92]

ciao a tutti!
ho una funzione che mi crea un elenco attraverso la stampa di codice con il metodo innerHTML... e fino a li tutto ok...
Poi ho creato un altra funzione che mi dovrebbe permettere di trasformare lo stesso elenco in orizzontale.
Potrebbe essere che elementi creati con innerHTML non recepiscono poi una successiva trasformazione...

Posto le due funzioni.

      <script>
         
      function crea_barra(){
          
          var elementi = document.getElementById('elementi').value;
          
          var box = document.getElementById('a');
          
          box.innerHTML+="<div id='menu' style='border:1px solid black;background-color:red;'><ul id='myul'></ul></div>";
          
          for(i=1;i<=elementi;i++){
              
              document.getElementById('myul').innerHTML+="<li id='opzione_"+i+"'>opzione_"+i+"</li>";
           }
        
       }  
      
      </script>
      
      <script>
      
      var elementi = document.getElementById('elementi').value;
      
      function orizzontale(){
          
          document.getElementById('menu').style.display='block';
          document.getElementById('myul').style.display='block';
          
          for (i=1;i<=elementi;i++){
              
            document.getElementById("opzione_"+i+"").style.display='inline';
          }          
          
      }      


      </script>

Grazie!

[cavicchiandrea]

A) Quando scateni la funzione orizzontale()?
B) Perché non la scrivi direttamente nell'elemento li opzione_ style="display:inline"? P.S. prova anche con (inline-block)

[Alifuma92]

La funzione è richiamata da un evento onclick di un button.

Non inserisco direttamente lo style perché l effetto che voglio e la trasformazione in tempo reale della Lista da verticale a orizzontale...

[KillerWorm]

Ciao, può essere che la variabile elementi (che dichiari prima della funzione orizzontale()) non venga valorizzata correttamente.
Prova ad inserirla all'interno della funzione stessa:

function orizzontale(){
  var elementi = document.getElementById('elementi').value;
  
  document.getElementById('menu').style.display='block';
  document.getElementById('myul').style.display='block';
  
  for (i=1;i<=elementi;i++){
    document.getElementById("opzione_"+i+"").style.display='inline';
  }
}

[Alifuma92]

GENIALE Killerworm! FUNZIONA perfettamente! grazie mille!