How To Select The Element Which Has Not Combinations Of Classes?
I am working on the following code. How can I hide only the divs which has not the classes as indicated in the mopt[]? As you can see I am trying to show only two divs which has th
Solution 1:
you can simply use this code..
$('.A.W.B').css("background-color", "red");
$(".box").not(".Q,.M").hide();
<!DOCTYPE html><html><head><title>demo</title><styletype="text/css">.box
{
height: 20px;
background: khaki;
width: 100px;
text-align:center;
}
</style></head><body><divclass="box A B F R W Q">Has Q</div><divclass="box A B F H K F">No Q</div><divclass="box A B F W R">No Q</div><divclass="box A B F H K F">No Q</div><divclass="box A B F W R M">Has M</div><divclass="box A B F H K F">No Q</div><divclass="box A B Q F H M K F">Has Q & M</div><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><scripttype="text/javascript"src="app.js"></script></body></html>Solution 2:
You're looking to hide boxes that have neither Q nor M, so you can filter on those that do not have .Q, .M, and hide those.
$('.A.W.B').css("background-color", "red");
let mopt = ['Q','M'];
$('.box').not(
mopt.map(function(className){ return'.'+ className; }).join(', ')
).hide();.box {
height: 20px;
background: khaki;
width: 100px;
text-align:center;
}<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><divclass="box A B F R W Q">Has Q</div><divclass="box A B F H K F">No Q</div><divclass="box A B F W R">No Q</div><divclass="box A B F H K F">No Q</div><divclass="box A B F W R M">Has M</div><divclass="box A B F H K F">No Q</div><divclass="box A B Q F H M K F">Has Q & M</div>
Post a Comment for "How To Select The Element Which Has Not Combinations Of Classes?"