Copy all styles from one element to another

Question

How can i get every styles (even inherited) from an element A to an element B ? in javascript or using jquery.

let\'s tell i have an element

Answer 1

Actually, sdleihssirhc's answer will not work on firefox as getComputedStyle(p, "").cssText will return an empty string, it's a longstanding and know bug: https://bugzilla.mozilla.org/show_bug.cgi?id=137687

The solution to also support Firefox is to iterate on getComputedStyle properties and create the CSS string manually:

var clonedNode = document.createElement("div");
const styles = window.getComputedStyle(node);
if (styles.cssText !== '') {
    clonedNode.style.cssText = styles.cssText;
} else {
    const cssText = Object.values(styles).reduce(
        (css, propertyName) =>
            `${css}${propertyName}:${styles.getPropertyValue(
                propertyName
            )};`
    );

    clonedNode.style.cssText = cssText
}