jQuery "this" and element collection [duplicate]

Within the click handler, this is a reference to the single DOM Element which fired the event—in this case the div element. By wrapping it in $() you create a jQuery reference to that div element (a jQuery object containing that single element, allowing you to call jQuery methods on it.

$(function() {
 $("div").click(function() {
 $(this).before("<p>Hi</p>"); // 'this' is an HTMLDivElement
 });
});

this is the DOM object, whereas $(this) is the jQuery wrapper around same.

When using this, you can call DOM methods on it, but not jQuery methods. When using $(this), you can call jQuery methods on it, but not DOM methods.

this is always the specific DOM node with which you're interacting, wherease $(this) is the same DOM node, but wrapped in a jQuery object.

The difference is that this can be used with plain JavaScript/DOM API (and $(this) cannot), whereas, if you need to use jQuery methods (hide(), show(), etc...), then you'll need to use $(this) (and not this).

this is just a reference. The language reads it as taking in the most currently active element.

It can be used throughout your code to enable many tasks to take a range of variables that are dependent on the current session.

In many object-oriented programming languages, this (or self) is a keyword which can be used in instance methods to refer to the object on which the currently executing method has been invoked.

take a look at this.

$(this) refers to the jQuery object created from the selector you attached the event handler too. Any div element the event is performed on becomes this along with the added properties and methods created from being a jQuery object

In this circumstance, this refers to the particular HTML element you have clicked.

No you need to put '$' sign before (this), or else it will result in JavaScript errors.

Copied from Nick Craver's answer:

• this - Refers to the DOM element in the handler you're currently on, but this may be another object entirely in other situations, but it's always the context.

• $this - Usually created by var $this = $(this) a cached version of the jQuery wrapped version for efficiency (or chain off $(this) to get the same in many cases).

• $(this) - The jQuery wrapped version of the element, so you have access to all its methods (the ones in $.fn specifically).

Using jQuery $(this)[0] is the same as using this in Javascript.

So $(this)[0] == this.

• jquery
• this