jquery addClass to element if css has style

Question

please have a look at following question and answer, the seccond answer (with the many upvotes) Jquery: How to check if the element has certain css class/style

looks like this:

if ($('#yourElement').css('position') == 'absolute') {
    // true
}

so this is awesome but I would like something like

if ($('#yourElement').css('position') == 'absolute') {
    $(this).addClass('xxx');
}

so the element with the ID "yourElement" gets a class added

what is the easyest way to do that

score 4 · Accepted Answer · answered Mar 04 '13 at 12:40

4

You could do it this way:

$('#yourElement').addClass(function(index, currentClass) {
    return $(this).css('position') == 'absolute' ? 'xxx' : '';
});

For more information on the syntax take a look at the API for .addClass().

answered Mar 04 '13 at 12:40

Anthony Grist

38,173
8
62
76

this one I like the most, thank you, and thanks to all the others – caramba Mar 04 '13 at 12:46

Boaz · Answer 2 · 2013-03-04T12:43:06.933

Assign $('#yourElement') to a variable. Then perform the check on that variable and add the class to it as well. This simply saves on the number of queries made to the DOM with the $() function in your example and in the likely possibility that further manipulation is required.

For example:

var your_element = $('#yourElement');
if (your_element.css('position') == 'absolute') { your_element.addClass('xxx'); }

score 2 · Answer 3 · answered Mar 04 '13 at 12:39

2

var yourElement = $('#yourElement');    
if (yourElement.css('position') == 'absolute') {
        yourElement.addClass('xxx');
}

answered Mar 04 '13 at 12:39

shere

101
3

score 2 · Answer 4 · answered Mar 04 '13 at 12:39

2

// Cache your element first
var $element = $('#yourElement');

if ($element.css('position') == 'absolute') {
    $element.addClass('xxx');
}

answered Mar 04 '13 at 12:39

palaѕн

72,112
17
116
136

jquery addClass to element if css has style

4 Answers4