Recursive call of executeQueryAsync for access nested structure

I am trying to access the nested pages structure but due to the async nature of executeQueryAsync function i am getting nested nodes in wrong orders.

I am calling a function getChildListItems, in which I get the list of items and on success of executeQueryAsync function I call the function OnSuccess. for getting nested items I am calling the recursive function getChildListItems in OnSuccess again.

to generate my nested table of content structure I want to iterate all nested items of first item and move of the other same level item in while (listEnumerator.moveNext()), but right now it iterate all the list items of the same level at once.

function OnSuccess(listItems) {
    var listEnumerator = listItems.getEnumerator();
    while (listEnumerator.moveNext()) {
            if(listEnumerator.get_current().get_item("OID")!=listEnumerator.get_current().get_item("PID")){         
            if(listEnumerator.get_current().get_item("SiteType")=='0')
                getChildListItems(listEnumerator.get_current().get_item("OID"));
           }                   
        }  
   }

I also tried to achieve sync behavior by using the promise, but could not achieve the results due to the recursion.

function OnSuccess(listItems) {

    var listEnumerator = listItems.getEnumerator();

    return $.when(1).then(function iterate(){ 

        if(!listEnumerator.moveNext()) return ; 

        if(listEnumerator.get_current().get_item("OID")!=listEnumerator.get_current().get_item("PID"))
        {   

            if(listEnumerator.get_current().get_item("PSiteType")=='0')
            {
                console.log("test");
                $.when(getChildListItems(listEnumerator.get_current().get_item("OID")))
                 .then(function(){
                     OnSuccess; 
                     iterate();                  
                 })
                .fail(failure);            
            }

        }             

    } 
)}