VIDesignz
VIDesignz

Reputation: 4783

Jquery String + Object + String

I have a small issue that I cannot seem to resolve.

Here goes... I have an input being created like this...

var input = $('<input/>');

If I do this....all is good

$(this).append(input);

If I do this though....

$(this).append('<div>' + input + '</div>');

It appends a div with the html [object Object]

Can someone guide me in the right direction?

Thank you in advance!

Upvotes: 0

Views: 53

Answers (2)

Arun P Johny
Arun P Johny

Reputation: 388316

you could

$('<div />').append(input).appendTo(this);

Demo: Fiddle

The problem is input is an jQuery object so when you use it in a string concatenation it will result in [object Object](default toString() for an object);


Or

var input = $('<input/>');
$('<div />', {
    append: input
}).appendTo(this);

Demo: Fiddle

Upvotes: 1

iCollect.it Ltd
iCollect.it Ltd

Reputation: 93571

You need to work with all strings, or all jQuery objects:

e.g.

$(this).append($('<div>').append(input));

or

$(this).append('<div>' + input[0].outerHTML + '</div>');
// I think this version is ugly :)

Notes:

  • $('<div>') creates a new jQuery DOM element, which can then have child content appended.
  • input[0].outerHTML will return the text string equivalent to the DOM objects HTML

Upvotes: 1

Related Questions