Loop on element and extract all child properties

I have the attached HTML
I would like a javascript code to execute on chrome console that
1 – go on all the

enter image description here

that have a child go recursively run on child and extract property

the output that i woudl like to have is


id="preview:section:subSectionF55group13:subSectionTabF55group13" --> class="ui-accordion ui-widget ui-helper-reset ui-hidden-container" --> data-form-designer-id="" --> "Group 13 Parties"
id="preview:section:subSectionF55group13:subSectionF55-10"--> class="ui-accordion ui-widget ui-helper-reset ui-hidden-container" --> data-form-designer-id="" --> "(05) [3/17] Declarant"
id="preview:section:subSectionF55group13:subSectionF55-10:F55-10-2" ---> class="ui-inputfield ui-inputtext ui-widget ui-state-default ui-corner-all other ui-state-hover" --> data-form-designer-id="F55-10-2" --> role="textbox" --> label="(05 016) [3/17a] Name"
id="preview:section:subSectionF55group13:subSectionF55-10:F55-10-3" ---> class="ui-inputfield ui-inputtext ui-widget ui-state-default ui-corner-all other ui-state-hover" --> data-form-designer-id="F55-10-3" --->  role="textbox" --> label="(05 017) [3/18] Declarant identification No. "

the label is on the span element onthe previus object