We are using a few jQuery UI elements in our web application, and I need to change their design. For example, the ui-progressbar is way too high and its rounded corners don’t fit well with our design.

But the style of these jQuery elements is not set in a stylesheet, it appears in <style> tags in the element itself. I see two options to override it:

1. Change it in my stylesheet, and litter the style with !important statements
2. Go into the jQuery library, and change it right where it’s assigned.

We are delivering the library ourselves, not linking to an externally hosted one, so option 2 will work.

But both approaches smell of an antipattern. Which one is the lesser evil, or is there a third one I haven’t thought of?