CODEWITHSUNDEEP
jqueryjquery-selectors
realtebo
realtebo

Reputation: 25645

jQuery: appendTo($('body')) dosn't work

var popupType1 = "<div id=\"layerpopuplock\" style=\"position:absolute; width:375px; height:170px; z-index:2; left: 2px; top: 50px; visibility: hidden; \">";
    popupType1 += "<table width=\"375\" border=\"1\" cellpadding=\"0\" cellspacing=\"0\" bordercolor=\"#FF0000\">";
    popupType1 += "<tr><td align=\"center\" bordercolor=\"#FFFFFF\" class=\"FacetBiggerFieldCaptionTD\" id=\"popupmessagelock\" nowrap>message</td></tr>";
    popupType1 += "</table></div>";

$(popupType1).appendTo($('body'));

This piece of code doesn't work.

I tryied a console.log of $('body') and I see it empty, but OF COURSE the html is already here, and the body is present.

Which can be the reason $('body') is empty ?

SOLUTION:

Sorry for wasting your time. My assumption was wrong: html is already here

I corrected in this way and now it goes, sorrry !!!!

$(function() {
    ... previous code ...
});

Upvotes: 0

Views: 4066

Answers (4)

Denys S&#233;guret
Denys S&#233;guret

Reputation: 382142

Replace your 2 last

popupType1 = ...

by

popupType1 += ...

to have an HTML string that makes sense.

Note also that it would be easier to see the result without the visibility: hidden; in the div style.

Demonstration

Upvotes: 8

BananaAcid
BananaAcid

Reputation: 3481

I see 3 points to pay attention to:

  1. concat (combine) the strings with += ... var longstr = str; longstr += str2;
  2. in .appendTo() use a selector instead of an object reference ... $(..).appendTo('body');
  3. are you using a DOM-Ready handler like jQuery.ready( ... ); to trigger your code? This handler ensures, all DOM nodes are ready while using your script and it will be inserted at the right place (not other nodes getting in the way, even tho the body node exists) jQuery API: .ready()

additionally to 2: you could also use $('body').append(popupType1);

additionally to 3: it may depend where you call your script - for example script tags within the body may behave odd adding elements.

Upvotes: 3

killercowuk
killercowuk

Reputation: 1343

popupType1 += "<tr><td align=\"center\" bordercolor=\"#FFFFFF\" class=\"FacetBiggerFieldCaptionTD\" id=\"popupmessagelock\" nowrap>message</td></tr>";
popupType1 += "</table></div>";

You are missing the += from your last two popupType1 assignments.

Upvotes: 1

Anton
Anton

Reputation: 32581

You need to do += on all right now it only appends </table></div>

Upvotes: 7

Related Questions