Targetting specific jquery element which have identical class names
<p>I have several divs which are generating dynamically which share same class names, If I hover on parent(myDiv) need to trigger an event and on hover need to add a class to <code>myDiv</code>(child button) and once I clicked on parent div(myDiv) need to unbind hover action?</p>

<pre><code>&lt;div class="myDiv"&gt;
  &lt;div class="myBtn"&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;div class="myDiv"&gt;
  &lt;div class="myBtn"&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;div class="myDiv"&gt;
  &lt;div class="myBtn"&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>Tried in the below way    </p>

<pre><code>$(document).on('click', '.myDiv', function() {
    //some task will goes here  
    $(this).unbind('hover');            
}).hover(function() {
    $(this).find('.myBtn').css('background','#666666');
});
</code></pre>