Programmatically Copying CSS Class properties over to a new Class

Question

The Problem

I'm creating a small app for a website. This app includes a form with validation, but I've been having errors. Some of the built in styles I needed to maintain the same theme have some jQuery scripts interfering, and causing errors. This prevents my jQuery from working, and stops my form validation.

Note: I can't remove their jQuery script, it has to be in my view

Possible Solution

While I could look through the browser's inspector and copy the styles over, I'd rather learn a way to copy the class's properties over into another class, one that the website's jQuery script isn't looking for, thus avoiding the error and keeping the style intact.

Question

How can I take a CSS class, and programmatically assign its properties to a brand new class.

Best,

Jacob

Answer 1

You can use this plugin

Basic usage:

$('#some-element').copyCSS('#another-element');  // copy all styles
$('#some-element').copyCSS('#another-element', ['top', 'left']);  // copy just top and left
$('#some-element').copyCSS('#another-element', null, ['top', 'left']);  // copy everything except top and left