• therearefivethings@lemmy.world
    link
    fedilink
    English
    arrow-up
    1
    ·
    1 year ago

    Just to make your pain a little less…

    function collapseNestedDivs(element) {
      const childDivs = element.querySelectorAll('div');
    
      childDivs.forEach((div) => {
        collapseNestedDivs(div); // Recursively check for nested divs
    
        if (div.childElementCount === 1 && div.children[0].tagName === 'DIV') {
          const nestedDiv = div.children[0];
          const parent = div.parentNode;
    
          // Move the styles from the nested div to the parent div
          Array.from(nestedDiv.style).forEach((styleName) => {
            parent.style[styleName] = nestedDiv.style[styleName];
          });
    
          // Move the classes from the nested div to the parent div
          nestedDiv.classList.forEach((className) => {
            parent.classList.add(className);
          });
    
          // Remove the nested div
          parent.removeChild(nestedDiv);
        }
      });
    }
    
    // Call the function to collapse the nested divs starting from a root element
    const rootElement = document.getElementById('root'); // Replace 'root' with your actual root element ID
    collapseNestedDivs(rootElement);