对象＃ <HTMLDivElement> 作为jQuery对象

Question

How can I get a #<HTMLDivElement> as a jQuery object?

I need to do the following: I have a list of div's with the class contents. So I iterate over it until I find the one with the additional class: "test"

here is my code:

$.each( $(".contents"), function( key, value ) {
    if (value.hasClass("test"))
    {
        alert("got it");
    }
});

I'm getting the exception: Uncaught TypeError: Object #<HTMLDivElement> has no method 'hasClass'

Answer 1

The each() function gives you DOM object and you have to convert it to jQuery object. You can pass value to $ jQuery function to convert it to jQuery object.

$.each( $(".contents"), function( key, value ) {
    if ($(value).hasClass("test"))
    {
        alert("got it");
    }
});

You do not need to iterate through each and simplify it like

elements = $(".contents.text")

Answer 2

Why not to do it simpler with:

$(".contents.test"). ...

Here jQuery will select element that has both "contents" and "test" classes set.

DEMO: http://jsfiddle.net/xfErG/

Answer 3

The main jQuery function can accept a DOM Element as its argument.

var foo = jQuery(HTMLElementNode);

The following two lines of code have the same end result:

var foo = jQuery('#foo');
var foo = jQuery(document.getElementById('foo'));