JQuery, GMaps and $('#myId') == getElementById("myId")

Question

Hello.

Why this isn't true?

$('#myId') == document.getElementById("myId")

I'm using JQuery 1.4.2 and trying to insert a GMap into an div element.

So, this works:

new google.maps.Map(document.getElementById("myId"),myOptions);

but this doesn't

new google.maps.Map($("myId"),myOptions);

Answer 1

You have a couple issues. First, ID selectors use #. Second, $(...) is a jQuery object, and you need to pass a DOM element.

Use $('#myId').get(0)

The get method.

Answer 2

It doesn't work because the google.maps.Map() constructor expects a a DOM element, while the jQuery selector returns a jQuery object.

You may want to use:

new google.maps.Map($("#myId")[0], myOptions);

Further reading:

• Google Maps API Groups: Why doesn't jQuery selection work?

Answer 3

$('#myId') creates a jQuery selection, while GMap requires a DOM element. You can convert the jQuery selection into a DOM element by using the $().get function:

new google.maps.Map($("#myId").get(0), myOptions);