Change Class li ul

cambiar class de una lista UL

by jlujan

HTML

<div class="col-12" id="nav">
            <ul id="progressbar" class="text-center">
              <li ><a  target="SheetView">Ticket Creado</a></li>
              <li ><a  target="SheetView">Page Two</a></li>
              <li ><a  target="SheetView">Page Three</a></li>
              <li ><a  target="SheetView">Page Four</a></li>
            </ul>
          </div>

CSS

.current{ background-color: #ff0079; }

JavaScript

//Funcion para cambiar class
                  function toggleNavSelected(el){
                    //alert("change");
                    var list = document.getElementById('nav').children[0];
                    for(var i=0; i<list.children.length; i++){
                        //var cur = list.children[i];
                        var cur = list.children[i];
                        if(el==cur){
                            //cur.classList.add("active","step0");
                            cur.classList.add("current");
                        } else {
                            // if(cur.classList.contains("active","step0")){
                            //     cur.classList.remove("active","step0");
                            // }
                        }
                    }
                }


                var list = document.getElementById('nav').children[0];
                    for(var i=0; i<list.children.length; i++){
                        var el = list.children[i];
                        el.firstChild.onclick = (function(){
                             toggleNavSelected(this.parentElement);
                             alert(this.parentElement)
                            // toggleNavSelected(0);
                            // alert(list.parentElement)
                            return false;
                        });
                    }