How to append a div inside a another div?

Question

I am a beginner to jQuery and I need to append the below div to this.element

var div = '<div id="labels" style="background:' + this.getBottomLabelColorForPercentage() + '; color:white; width:' + this.element.clientWidth + '; text-align:center; height:30px;"><div style="padding-top: 1px;">' +  this.getNeedlePointerValue() + this.model.properties.rightlabel + '</div></div>';
div.appendTo(this.element);

But exception thrown as

sourcefile.js:71 Uncaught TypeError: div.appendTo is not a function

How to add that my div effectively into the this.element ?

Answer 1

In your case div is a string variable so it doesn't contain any DOM or jQuery related functions. What you need is to convert that string to jQuery element first.

To create the jQuery object you need to use $() function with a htmlString param:

$(div).appendTo(this.element);