CODEWITHSUNDEEP
jquery
ffffff01
ffffff01

Reputation: 5238

Select class nearest clicked button

I want to expand the nearest div with the class "divtoexpand" when clicking button1.

How can I achieve this?

HTML:

<div class="test">
    <div class="menu">
        <div class="button1"></div>
    </div>
</div>
<div class="divtoexpand"></div>

<div class="test">
    <div class="menu">
        <div class="button1"></div>
    </div>
</div>
<div class="divtoexpand"></div>

Upvotes: 2

Views: 108

Answers (3)

diasks2
diasks2

Reputation: 2142

First I would give your button an ID. Then you can do a show when the button is clicked:

 <div class="test">
     <div class="menu">
         <div class="button1" id="foo"></div>
     </div>
 </div>
 <div class="divtoexpand" id="bar"></div>

 <script>
   $("#foo").click(function(){
     $("#bar").show()   
   });  
 </script>

Upvotes: 0

Alp
Alp

Reputation: 29739

If you need a more general approach you could try the following:

$('.button1').on('click', function() {
  $(this).parents().next('.divtoexpand').slideDown();
})

DEMO

Upvotes: 0

thecodeparadox
thecodeparadox

Reputation: 87073

$('.button1').on('click', function() {
  $(this).closest('div.test').next('div.divtoexpand').slideDown();
});

DEMO

Upvotes: 3

Related Questions