Select and trigger click of hidden element based on it's css value

Question

i have some div's [up to 1000] whose class name are same and different colours . please see the following html

     <div class="class-1" style="background-color:red; display:none;">1</div>
     <div class="class-1" style="background-color:black; display:none;">2</div>
     <div class="class-1" style="background-color:rgb(0,12,34); display:none;">3</div>
     ...
     <div class="class-1" style="background-color:rgb(5,12,65); display:none;">1000</div>

Here how can i trigger the click of class1 whose background color is black ? I check with filter function but i didn't get the correct result

 $(".class-1").filter(function(){
       var match="black";
   return ( $(".class-1").css('background-color') == match );
}).trigger("click");

Please help.

Oh man this does not seem like a good way to do this, if possible you should assign the styles to different classes and query using $("className").click(function(){}); ? — John F.
– John F., Commented Jan 15, 2017 at 8:32

squiroid · Accepted Answer · 2017-01-15 09:04:39Z

1

If you compare the below. It should work

 var match = "rgb(0, 0, 0)";

Here is CodePen: http://codepen.io/rachitgulati26/pen/MJjaBp.

answered Jan 15, 2017 at 9:04

squiroid

14.1k7 gold badges50 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jafar tm Over a year ago

Could you please attach the code here , instead of writting in codepen . Thank you .

Jafar tm Over a year ago

also, how can i add extra class to the selected one ? for example i need to add a class named selected to the one who have background color is black

dayvidwhy · Accepted Answer · 2017-01-15 08:31:40Z

0

You might have forgotten to write a closing quote on your code on the second line.

Try changing it to var match="black"; and see if that helps.

The jQuery function .css() works that way and should work.

See https://api.jquery.com/css/ for more information, but based on the first example they give it is possible to retrieve your colour string that way.

answered Jan 15, 2017 at 8:31

dayvidwhy

761 silver badge5 bronze badges

Comments

Medda86 · Accepted Answer · 2017-01-15 08:36:25Z

0

I would suggest you use data tags. HTML

<div data-color="black">black</div>

JQUERY

$('[data-color="black"]').html('black found');

answered Jan 15, 2017 at 8:36

Medda86

1,6501 gold badge13 silver badges19 bronze badges

1 Comment

Jafar tm Over a year ago

sorry , i cannot rewrite the html structure .

Collectives™ on Stack Overflow

Select and trigger click of hidden element based on it's css value

3 Answers 3

2 Comments

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

1 Comment

Related