Question: ```js
$( document ).ready(function() {

  $('#handler').on('click', '.selector', function(){
    alert( $(this).text());
  });

});
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="handler">
  handler content
  <a href="#" class="selector">selector content</a>
</div>
```

How do I get the `#handler` inside the `on` method without explicitly specifying it?

Answer: 
Use [closest()](http://api.jquery.com/closest) if the parent has hierarchy,

```
$(this).closest('div')

```

and use [parent()](http://api.jquery.com/parent) if it is direct parent of target element,

```
$(this).parent('div');

```

And the selector is unique and has id like `handler` then the best option is 

```
$('#handler')

```
Change it to

```
$( document ).ready(function() {
  $('#handler').on('click', function(){
    //$(this) here will be #handler.
  });  
});

```

Or if you still want the function to fire when someone clicks on `.selector` then you can do the following

```
$( document ).ready(function() {
  $('#handler').on('click', '.selector', function(){
    var handler = $(this).parent();
  }); 
});

```