I'm using javascript to reach img elements nested in some <div>.After that I want to add those images to a string variable.

I wrote that:

var SomeVariable="";
$("myDivId img").each(function(){
  console.log(this);
  SomeVariable += this;
});
console.log(SomeVariable);

When console.log is used in .each function, it shows something like:

<img (some elements)>, which is exactly what I want.

When I use console.log at the end, to write whole value, it says:

[object HTMLImageElement][object HTMLImageElement]

I tried to use some conversion, but I don't really know how to get to it.

I'm using javascript to reach img elements nested in some <div>.After that I want to add those images to a string variable.

I wrote that:

var SomeVariable="";
$("myDivId img").each(function(){
  console.log(this);
  SomeVariable += this;
});
console.log(SomeVariable);

When console.log is used in .each function, it shows something like:

<img (some elements)>, which is exactly what I want.

When I use console.log at the end, to write whole value, it says:

[object HTMLImageElement][object HTMLImageElement]

I tried to use some conversion, but I don't really know how to get to it.

• javascript

• 1 Do you want the string representation of their HTML? – alex Commented Oct 16, 2012 at 11:37
• DOM elements are not HTML. The console just represents them with HTML syntax for visual purposes. The correct toString() value of the element is [object HTMLImageElement]. – I Hate Lazy Commented Oct 16, 2012 at 11:43

1 Answer 1

Assuming you want the string representation of their HTML...

var html = $("myDivId img").clone().appendTo("<div />").html();

If you're only supporting browsers which have the outerHTML property.

var html = $("myDivId img")
           .map(function() { return this.outerHTML; }).get().join("");

The reason you get "[object HTMLImageElement]" is because an Object's toString() will give you "[object x]", where x is the [[Class]] (an internal property) of the object.