determining $(this) in jquery

Question

A common issue I have is getting confused what $(this) is referring to. I often will try to give it some odd style: ``` $(this).css("border","10px solid red") ``` Which helps sometimes. I'm stumped with the following however. My question can maybe be answered in two ways: 1) is there a universal way to 'see' what $(this) is referring to in any given situation? Perhaps in combination with firebug? 2) more specifically, any idea what $(this) should be referring to in this sample below? I assumed it would have been the input with a class of btnSave but doesn't seem to be: ``` $(ajaxContainer).find("input.btnSave").click(function(){ savePanel(); }); function savePanel() { $(this).css("border","10px solid red"); }; ```

Accepted Answer

1) Use the console in Firebug:

```
var obj = $(this);
console.log(obj);
```

2) savePanel() won't have the context correct to use $(this). You could try:

```
$(ajaxContainer).find("input.btnSave").click(function(){
    $(this).css("border", "10px solid red");
});
```

determining $(this) in jquery

Solution

Problem