How to add css style to the all children of element at the same time?

Question

Such as:

<div class="mostOut">
    <div class="a">
        <h3 class="b"></h3>
        <div class="d"></div>
    </div>
</div>

And how can I apply css style to the children of "moustOut" at the same time.E.g:

with one click event.the css('opacity',1) could apply to the "a","b","d" at the same time.Or ,exclude "b" .

Answer 1

a little less code

$('.mostOut').click(function()
{
   $(this).children("*").css('opacity', 1);
});

and exclude ".b"

$('.mostOut').click(function()
{
   $(this).children("*").not(".b").css('opacity', 1);
});

or alternatively if its not the opacity causing the hidden/none

$('.mostOut').click(function()
{
   $(this).children("*").show();
});

Answer 2

This might be a dirty solution, but it should work:

$('.mostOut').click(function()
{
  $(this).find('*').each(function()
  {
    $(this).css('opacity', 1);
  });
});

For excluding all but the b element, try this:

$('.mostOut').click(function()
{
  $(this).find('*').not('.b').each(function()
  {
    $(this).css('opacity', 1);
  });
});

Play with the code, as I just typed this off of the top of my head, so I'm not guaranteeing that it will work.

Good luck!