OnClick element within specific element

Question

I wish to know an elegant solution for clicking on a certain class within a certain div

$( ".clickdiv" ).on( "click", function () { //do stuff }

This works for any class of clickdiv. However, I want it only to work if the clickdiv is nested with certain div

<div class="certaindiv">
   ...bunch of divs
       <div class="clickdiv">
   ...bunch of close divs
<div>

Pranav C Balan · Accepted Answer · 2015-07-31 13:50:36Z

1

Update your selector as .certaindiv .clickdiv that it will only select .clickdiv inside .certaindiv

$(".certaindiv .clickdiv").on("click", function() { 
  alert('clicked');
  //do stuff
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="certaindiv">
  ...bunch of divs
  <div class="clickdiv">
    shdhsghdh
  </div>
  ...bunch of close divs
</div>
<div class="clickdiv">
  shdhsghdh
</div>

edited Jul 31, 2015 at 13:50

answered Jul 31, 2015 at 13:47

Pranav C Balan

115k25 gold badges173 silver badges195 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

myol Over a year ago

Ugh friday afternoon strikes again... Thanks

Pranav C Balan Over a year ago

@myol : glad to help ;)

Stryner · Accepted Answer · 2015-07-31 13:48:02Z

1

If the elements are on the page when it loads and never change, you can simply modify your selector:

$( ".certaindiv .clickdiv" ).on( "click", function () { /*do stuff*/ }

If the elements are dynamically created, you can use event delegation:

$( ".certaindiv" ).on( "click", ".clickdiv", function () { /*do stuff*/ }

answered Jul 31, 2015 at 13:48

Stryner

7,3363 gold badges21 silver badges20 bronze badges

Collectives™ on Stack Overflow

OnClick element within specific element

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related