Tree menu - Error when selecting element (ul: onclick)

var subs = document.body.querySelectorAll(".ul-0 li");
for(var x=0; x<subs.length; x++){
   subs[x].addEventListener("click", function(e){
      e.stopPropagation();
   });
}


function ready (fn) {
        if (document.attachEvent ? document.readyState === "complete" : document.readyState !== "loading")
        {
           return fn();
        }
        else{
           return document.addEventListener('DOMContentLoaded', fn);
        }
 }
ready(function(){
       var n = document.querySelector('.menu-arvore');
       var n_0 = document.getElementsByClassName('li-0');
       var n_1 = document.getElementsByClassName('li-1');
       
       for (let n = 0; n < n_0.length; n++) {
                const element = n_0[n];
                el = element;
                el.onclick = function() {
                var c = element.childNodes;                
                    
                    if(c[1].className === 'ul-0' ){
                        c[1].className = "ul-0 ativo";
                    }else if(c[1].className == "ul-0 ativo"){
                        c[1].className = "ul-0";
                    }   
                    return false;
                };
                
            } 

    
            for (let n = 0; n < n_1.length; n++) {
                const element = n_1[n];

                element.onclick = function() {

                var c = element.childNodes;                   
                
                    if(c[1].className === 'ul-1' ){
                        c[1].className = "ul-1 ativo";
                    }else if(c[1].className === 'ul-1 ativo'){
                        c[1].className = "ul-1";
                    }     
                    return false;
                };
                
            } 
       
})

.menu-arvore{
        cursor: pointer;
    }
    .ul-0 , .ul-1{
        display: none;
    }
    .ativo{
        display: block !important;
    }

<div class="header">
        <h1>Menu Árvore</h1>
    </div>
<ul class="menu-arvore">
    <li class="li-0">2018
        <ul class="ul-0">
            <li class="li-1">Janeiro
                <ul class="ul-1">
                    <li >Cuidando da casa comum</li>
                </ul>
            </li>
            <li class="li-1">Fevereiro
                <ul class="ul-1" >
                  <li >Política em pauta</li>
                </ul>
            </li>
            <li class="li-1">Março
                <ul class="ul-1">
                    <li >Semeando o bem</li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="li-0">2017
        <ul class="ul-0">
            <li class="li-1">Janeiro
                <ul class="ul-1">
                    <li>Cuidando da casa comum</li>
                </ul>
            </li>
            <li class="li-1">Fevereiro
                <ul class="ul-1">
                  <li>Política em pauta</li>
                </ul>
            </li>
            <li class="li-1">Março
                <ul class="ul-1">
                    <li>Semeando o bem</li>
                    <li>Semeando o bem</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>