Jquery - Onclick button trigger all divs within a class

Question

I am new to Jquery so please pardon me if I am asking a simple question but I need some help.

In my HTML markup, I have 3 divisions with id from test1 to test3 and a button.

<input type="button" id="button_click" value="ok" />
<div class="supercolor" style="width:100px;">
  <div class="colordiv" id="test1" >&nbsp;</div>
  <div class="colordiv" id="test2" >&nbsp;</div>
  <div class="colordiv" id="test3">&nbsp;</div>
</div>

What I want to do is on button click, I want to iterate through all divs in the 'supercolor' class to change the div's css background to red.

Code I have now

$('#button_click').click(function(){
   $('div.supercolor').each(function() {
   $(this).css("background-color","red");
   });
});

alex · Accepted Answer · 2011-05-09 00:52:18Z

1

$('#button_click').click(function() {
    $('.supercolor > div').css('background-color', '#f00');
});

answered May 9, 2011 at 0:52

alex

492k205 gold badges891 silver badges992 bronze badges

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

Comments

Ry- · Accepted Answer · 2011-05-09 00:51:04Z

1

$('div.supercolor div').css('background-color', 'red');

Is probably what you need.

answered May 9, 2011 at 0:51

Ry-♦

226k56 gold badges496 silver badges504 bronze badges

1 Comment

wombleton Over a year ago

I read the question as meaning all divs with the supercolor class.

melaos · Accepted Answer · 2011-05-09 00:53:35Z

1

actually if they're going to be the same color then you can just do as what minitech suggested. but just for completeness sake.

you just missed out the div in your .each.

$('#button_click').click(function(){
   $('div.supercolor > div').each(function() {
   $(this).css("background-color","red");
   });
});

answered May 9, 2011 at 0:53

melaos

8,4385 gold badges61 silver badges95 bronze badges

Collectives™ on Stack Overflow

Jquery - Onclick button trigger all divs within a class

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related