Change a CSS property value with jquery only when it has a certain function

Question

I want to use jQuery to change a CSS property value but only if the property has a certain function.

For example: [class="btn"] { background-image: linear-gradient(red, white) }

I only want to set background-image to none when it has the function linear-gradient. I dont want to change it in any other case.

Thank you very much!!!

Answer 1

You could get the value for the background-image and then test it against linear-gradient(red, white); :

var element = $('[class=“btn”]'); // or just $('.btn');
if(element.css('background-image') == 'linear-gradient(red, white)') {
    // do something
}

Or maybe just check against linear-gradient so it will match no matter which colors are used by the gradient;

var element = $('[class=“btn”]'); // or just $('.btn');
if(element.css('background-image').indexOf('linear-gradient') == 0) { // == 0 to check if the background-image starts with linear-gradient
    // do something
}