Jquery detect element type in if

Question

I have the following JQuery http://jsfiddle.net/gg9xnkqq/1/

$(document).ready(function () {
    if( $('.one').hasClass('one') ){
        $('.one').css({ 'color' : '#f00' });
    }
});

and this HTML

<div class="one">dfv</div>
<div class="one">dfv</div>
<div class="one">dfv</div>
<div class="one">dfv</div>
<div class="one">dfv</div>
<div class="one">dfv</div>
<div class="one">dfv</div>
<div class="one">dfv</div>
<span class="one">oiuoiuioou</span>

In the if statement, how can I detect if the type of the element with the class one is not body?

So all elements that are not body and have a certain class, will have their class changed.

`if( $('.one').hasClass('one') ){` will only ever be true, you can remove that — atmd, Jun 02 '15 at 16:11

Karamazovi · Answer 1 · 2015-06-02T16:15:58.663

3

Since there is only 1 body you can select the elements as follows $('body .one') that way it'll select all the elements with class one inside the body.

edited Jun 02 '15 at 16:15

answered Jun 02 '15 at 16:12

Karamazovi

55
1
9

I wish I'd had the common sense to think of that first... :) – David Thomas Jun 02 '15 at 16:15
According to this http://stackoverflow.com/questions/2035462/multiple-htmlbody-html-body-in-same-file multiple body tags are invalide. So nice one! – AmmarCSE Jun 02 '15 at 16:18

score 1 · Answer 2 · answered Jun 02 '15 at 16:10

1

Use jQuery not()

$('.one').not('body').css({ 'color' : '#f00' });

This will

Remove elements from the set of matched elements.

Therefore, there is no need for the if

answered Jun 02 '15 at 16:10

AmmarCSE

30,079
5
45
53

score 1 · Answer 3 · answered Jun 02 '15 at 16:10

You could just use not():

$('.one').not('body').css({ 'color' : '#f00' });

Or :not():

$('.one:not("body")').css({ 'color' : '#f00' });

Or filter():

$('.one').filter(':not("body")').css({ 'color' : '#f00' });

Or:

$('.one').filter(function () {
    return $(this).not('body');
}).css({ 'color' : '#f00' });

What you don't need to do is:

if( $('.one').hasClass('one') ){
    $('.one').css({ 'color' : '#f00' });
}

Because if the elements didn't have the class of one they wouldn't have been selected by the selector comprising of the class-name one.

References:

Jquery detect element type in if

3 Answers3