Question

Assume there are three classes

<div class="hello world_1"></div>
<div class="hello world_2"></div>
<div class="hello world_3"></div>

I want to get the class name “world_1″,”world_2” and “world_3” based on “hello”. The code:

$('.hello').each(function(){
  this.attr('class');
});

got error saying:

TypeError: Object #<HTMLDivElement> has no method 'attr'

I experimented a little bit and found

$('.hello:first').attr('class')

works while

$('.hello')[0].attr('class')

raises the above error.

Could anyone explain why it happened and how can I get what I want?

Thanks

Answer 1

You need to wrap the this, like so…

$('.hello').each(function(){
  $(this).attr('class');
});

jQuery provides this as a reference to a native DOM element. To able to call jQuery methods on it, wrap it with the jQuery constructor.

If you want to match class of pattern world_n, you could use…

var matches = $(this).attr('class').match(/(?:^|\s)world_\d+(?:\s|$)/);