使用js将CSS“ display：none”值替换为“ display：flex”

Question

i'm attempting to replace a css value "display:none" defined on a div by a "display:flex" using js property .css(). When doing so, safari on Ipad ignores the js instruction (i used the prefixes for cross browser compatibility + tried css !important) and instead it applies "display:block" which is the user agent style defaulted value (i have a reset.css in place as well)...it ends up not giving what i'm looking for. However the issue does not occur on desktop browsers. Any tips to override this defaulted value on Ipad please?

Answer 1

try as below create a CSS class

.temp{
display:flex!important;
}

add that class dynamically to the element using addClass function in jquery

$(selector).addClass('temp');