CODEWITHSUNDEEP
javascriptjquery
Yeak
Yeak

Reputation: 2538

jquery select div below parent div

I have a few divs set up like so:

 <div class="menu_options">
    <div class="parent_div">input field</div>
    <div class="children_div">
        <div class='something">field</div>
        <div class="something_else">field</div>
    </div>
 </div>

<div class="menu_options">
    <div class="parent_div">input field</div>
    <div class="children_div">
        <div class='something">field</div>
        <div class="something_else">field</div>
    </div>
 </div>

<div class="menu_options">
    <div class="parent_div">input field</div>
    <div class="children_div">
        <div class='something">field</div>
        <div class="something_else">field</div>
    </div>
 </div>

in jquery i am doing 

        $('.parent_options').each(function() {
            $(this).click(function() {

            });
        });

right now $(this) is giving me the parent_div that i clicked on and I need to be able to move down to the children_div and hide the entire children_div. Any ideas. I know in prototype i used a down function but not sure if jquery has it.

Upvotes: 4

Views: 3268

Answers (4)

subindas pm
subindas pm

Reputation: 2784

try .next()

 $( this ).next( ".tb-contents'" ).show();

This will work.

Thanks

Upvotes: 0

Bruno
Bruno

Reputation: 5822

If you want to hide .children_div after clicking on .parent_div use

  $('.parent_div').click(function() {
        $(this).siblings(".children_div").hide();
  });

Demo here

Upvotes: 3

BenM
BenM

Reputation: 53246

If you're binding the function to all .menu-options, there's no need for each(). This should work if I understood your query properly:

$('.parent_div').click(function() {  
    $(this).siblings('.children_div').hide();
});

Upvotes: 0

vorillaz
vorillaz

Reputation: 6286

$('.parent_div').each(function() {
            $(this).click(function() {
        $(this).next().hide();
            });
        });​

Upvotes: 0

Related Questions