CODEWITHSUNDEEP
javascriptjquery
stack
stack

Reputation: 10218

Why don't .not() have any affect?

Here is my code:

$('body').not('.specific_element').css('opacity','.3');
body{
  border: 1px solid;
}
.specific_element{
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>There are some texts</p>
<div class="specific_element">
  sth
</div>
<p>whatever</p>

All I'm trying to do is keeping the opacity of the element that has a red border to 1. I mean I want to apply opacity: .3 on everything except that specific element. How can I do that?

Upvotes: 2

Views: 85

Answers (4)

Richard
Richard

Reputation: 106

$('*:not(*[class*="specific_element"])').css('opacity','.3');

on everything except that specific element.

Use * to select everything

Upvotes: 1

taras-d
taras-d

Reputation: 1827

// Select all elements inside body except '.specific_element'
$('body *').not('.specific_element').css('opacity','.3');

Upvotes: 2

stack
stack

Reputation: 10218

As @guradio suggested, it would be done by applying opacity on sibling of the specific element:

$('.specific_element').siblings().css('opacity','.3');
body{
  border: 1px solid;
}

.specific_element{
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>There are some texts</p>
<div class="specific_element">
  sth
</div>
<p>whatever</p>

Upvotes: 0

guradio
guradio

Reputation: 15555

  1. Apply the opacity on the children of the container with the exception of the specific element

$('body').children().not('.specific_element').css('opacity','.3');
body{
  border: 1px solid;
}

.specific_element{
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>There are some texts</p>
<div class="specific_element">
  sth
</div>
<p>whatever</p>

Upvotes: 3

Related Questions