I have this situation where I need to create a multi-dimensional javascript / jQuery array or object from available html div containers.
Each div element has a class named indexed, an ID, and an attribute called data-id such as following example:
jQuery( document ).ready( function ( $ ) {
var obj = {}
var count = 0;
function extract_children( parent ){
parent.find( '.indexed-' + parent.attr( 'id' ) + '-children > .indexed' ).each( function() {
// need to build the object here and and return it
console.log( $( this ).attr( 'id' ) );
console.log( $( this ).attr( 'data-id' ) );
var next = $( '.indexed-' + $( this ).attr( 'id' ) + '-children > .indexed' );
if( next && next.hasClass( 'indexed') ) extract_children( $( this ) );
});
}
$( '.indexedcontainer > .indexed' ).each( function(){
count++;
obj[ count ] = {};
obj[ count ][ 'id' ] = $( this ).attr( 'id') ;
obj[ count ][ 'data-id' ] = $( this ).attr( 'data-id');
obj[ count ][ 'children' ] = extract_children( $( this ) );
}).promise().done( function(){
console.log( obj );
});
}); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class="indexedcontainer">
<div class="indexed" id="1" data-id="1000">
<div class="indexed-1-children">
<div class="indexed" id="101" data-id="1001">
<div class="indexed-101-children">
<div class="indexed" id="102" data-id="1002">
<div class="indexed-102-children">
<div class="indexed" id="1022" data-id="10022">
there can be more such recurrence
</div>
<div class="indexed" id="1023" data-id="10023">
there can be more such recurrence
</div>
</div>
</div>
</div>
</div>
<div class="indexed" id="102" data-id="1002">
<div class="indexed-102-children">
<div class="indexed" id="1022" data-id="10022">
there can be more such recurrence
</div>
</div>
</div>
</div>
</div>
</div>there can be more than one first level div elements like
<div class="indexed" id="2" data-id="2000">...</div>
<div class="indexed" id="3" data-id="3000">...</div>
desired array or object required
obj[ 1 ][ id ] = 1;
obj[ 1 ][ data_id ] = 1000;
obj[ 1 ][ children ][ 1 ][ id ] = 101;
obj[ 1 ][ children ][ 1 ][ data_id ] = 1001;
obj[ 1 ][ children ][ 1 ][ children ][ 1 ][ id ] = 102;
obj[ 1 ][ children ][ 1 ][ children ][ 1 ][ data_id ] = 1002;
obj[ 1 ][ children ][ 1 ][ children ][ 1 ][ children ][ 1 ][ id ] = ...
obj[ 1 ][ children ][ 1 ][ children ][ 2 ][ id ] = 103;
obj[ 1 ][ children ][ 1 ][ children ][ 2 ][ data_id ] = 1003;
obj[ 1 ][ children ][ 1 ][ children ][ 2 ][ children ][ 1 ][ id ] = ...
2