JSFiddle - React, Tailwind, and code Playground

HTML

= a.substring(i, i+8);children

JavaScript

var data = '[{"name":"node1","id":1,"children":[{"name":"child1","id":2},{"name":"child3","id":3},{"name":"child2","id":4},{"name":"child2","id":5}]},{"name":"node2","id":6,"children":[{"name":"child3","id":7}]}]';

    /*'[{"name":"node2","id":6,"children":[{"name":"child3","id":7}]}]'*/
    var arrays = [],
        primaryLoop = 0;
    //convert you string to object
    //or you can simply change your first row.
    data = $.parseJSON(data);
    //function to loop the array
    function listNodes(inputVal){
        if(jQuery.isArray( inputVal )){
            primaryLoop++;
            $.each(inputVal, function(i,elem){
                arrays.push(elem.id);
                console.log(elem);
                if(jQuery.isArray( elem.children )){
                    arrays.push('c');
                    listNodes(elem.children);
                    arrays.push('|');
                }
                if( --primaryLoop == 0 )
                    arrays.push('&');
            })
        }
    }
    listNodes(data);
    alert(arrays.join().replace(/,\&,*/g,'}{'));

var dad = [];
var son = [];
function dadSon(a){
    var each;
    var numb;    
    a = '' + a;    
    //1,c,2,3}{4,5,|,6,c,7,|
    for(var i=0;i < a.length;i++){
        each = a.substring(i-1,i);
        numb = isNaN(each);
        if(numb === false && (a.substring(i+1,i+2) === 'c')){
            dad.push(each);
            var j = i + 1;
            while(j < a.length){
                each = a.substring(j, j+1)
                console.log(each);
                j++;
                if(isNaN(each)){
                    son.push(a.substring(j,j+1));
                }
                if(each === '&'){break;}
            }
        }
        /*if(numb === true){
            if(each == 'c'){
                son = a.substring(i+1,i+2); 
            }
        }*/
    }
    console.log("DAD: "+dad+" & SON: "+son);
}

dadSon(arrays);