Some trouble with jQuery

Question

Is this html

  <div class='title centered'>SCE</div>
  <div class='description'>
    Magna tristique pulvinar porta montes, scelerisque
    odio montes porta habitasse, ut, arcu scelerisque vel, pellentesque
  </div>

I need to fade childer div (description) after clicking on parent (title).

  $('.title').click(function() {
    $(this).find('.description').fadeOut(fadeTime);
  })

What is wrong?

Answer 1

Try with:

$("#t_sce").click(function() {
    $("#d_sce").fadeOut(fadeTime);
});

Answer 2

did you try with this?

$('.title').click(function() {
    $('.description').fadeOut(fadeTime);
  })

Answer 3

If you have this just once on your page, balalakshmi's answer will work. If you have more than one, go with this:

$('.title').click(function() {
  $(this).next('.description').fadeOut(fadeTime);
})

Note the use of next, which looks at the next element at the same level in the dom,instead of find which looks for decedents.

Finally, if the effect you are really trying to achieve is a toggle on title click, use slideToggle or one of the many fadeToggle plugins.

Answer 4

Use $.next() to find the next element and work with that

$('.title').click( function() {
    $(this).next('.description').fadeOut( fadeTime );
});

Answer 5

The wrong thing is that in your code "description" is not a child of "title".

I think balalakshmi's answer will do the job for you or you can use if you don't want to use "description" class as a selector:

  $('.title').click(function() {
    $(this).next().fadeOut(fadeTime);
  })

Answer 6

I would have another parent div wrap around it.

<div class='item'>
   <div class='title centered'>SCE</div>
      <div class='description'>
        Magna tristique pulvinar porta montes, scelerisque
        odio montes porta habitasse, ut, arcu scelerisque vel, pellentesque
      </div>
   </div>
</div>

Then I would call using

$('.title').click(function() {
  $(this).parents('div.item').find('.description').fadeOut(fadeTime);
})

This code is not depended on the order of the discription div.