What is the correct way to use “this” in jquery?

Question

I want to catch the title attribute of a element from multiple elements having the same class, but different attributes.

This is what I have tried:

HTML

    <div title="title1" class="pager" onclick="location.href='link.aspx';></div>
    <div title="title2" class="pager" onclick="location.href='link.aspx';></div>
    <div title="title3" class="pager" onclick="location.href='link.aspx';></div>
    <a class="pagerTitle"></a>

jQuery

$(".pager").bind("mouseover", function() {
        $(".pagerTitle").text(this.attr("title"));
    });

But it is not working. What is the correct method to do so?

Answer 1

You can use one of two methods:

jQuery:

$(this).attr("title")

Plain vanilla JavaScript:

this.title

I'd vote for plain JavaScript so you don't incur the overhead of creating a jQuery object for each tag.

Answer 2

You used attr() method of jQuery object, but this is not jQuery object. Use $(this) instead.

Answer 3

" $(this) is one of very popular construct to indicate current element is focus, which can be used inside event and selector functions. This is as equal to JavaScript's this construct wrapped by jQuery's function to provide access to jQuery's function."

You should use $(this) . Hope it helps!