html - prevent unknown css properties from being removed from the style attribute -

so have js adds style attribute css filters. have added both webkit-prefixed , unprefixed version of property, this:

<img src="image.jpg" style="filter: blur(10px); -webkit-filter: blur(10px)"/> 

i need save html , display in different browser. however, filters aren't visible in different browsers, because unknown attributes removed. example, if filters added in webkit, non-prefixed property removed browser, preventing html later working in firefox. way override browser's removing unknown properties style attribute, unprefixed version visible in different browser. know can add js recalculates filters on pageload, prefer not this. there better solution?

i have example here , can see (e.g. in chrome) style attribute not updated css attributes don't apply and

$().html() 

will only.

in problem may don't need prefixes.

worth notice fact, taken jquery decumentation, that

as of jquery 1.8, .css() setter automatically take care of prefixing property name.

so don't need add of them, jquery 1.8+ take care of it.

following topic of retrieving html dynamically added style - can retrieve .html() if first add .attr('style', 'filter: -webkit-filter: blur(10px)');