CODEWITHSUNDEEP
jqueryhtmlcss
Stephan
Stephan

Reputation: 27

Find following Element which matches class

I need help with the following task: I have the following HTML.

<div class="row">
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-12 tileinfo"></div>
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-12 tileinfo"></div>
</div>
<div class="row">
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-12 tileinfo"></div>
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-3 col-sm-6 portfoliotile"></div>
  <div class="col-md-12 tileinfo"></div>
</div>

All Elements with class .portfoliotile are clickable elements. I need a solution to get the following element with class .tileinfo

I've tried it with 

$(this).closest('.tileinfo').addClass('active');

this represents the clicked .portfoliotile-Element but I think I'm on the wrong way...

Upvotes: 0

Views: 56

Answers (4)

Ibrahim Khan
Ibrahim Khan

Reputation: 20740

Use nextAll('.tileinfo:first') to get the following first element which has the class tileinfo.

 $(this).nextAll('.tileinfo:first').addClass('active');

Upvotes: 3

Lalji Tadhani
Lalji Tadhani

Reputation: 14159

use next

$('.portfoliotile').click(function(){
$(this).next('.tileinfo').addClass('active');
})

https://jsfiddle.net/1n2ye3t1/

Upvotes: -1

Satpal
Satpal

Reputation: 133403

You can also use .siblings()

$(this).siblings('.tileinfo').addClass('active');

Upvotes: 0

Adil
Adil

Reputation: 148120

Use closest to get parent div and find to get descendants having class tileinfo

$(this).closest('.row').find('.tileinfo').addClass('active');

Upvotes: 0

Related Questions