title: Added html element is added to DOM but not visible
body: <p>I add html to a div as following:</p>
  
  <pre><code>var parent = $('#loginPage');
  console.log(parent);
  parent.append('&lt;p&gt; TEST &lt;/p&gt;');
  </code></pre>
  
  <p>It gets added correctly I can view it in firebug DOM, but it does not show up on the actual page.</p>
  
  <p>What could cause that problem?</p>
  
  <p>EDIT: this is the html</p>
  
  <pre><code>!DOCTYPE html&gt;
  &lt;%@page import="auth.BasicAuthRedirectServlet"%&gt;
  &lt;%@page import="model.User"%&gt;
  &lt;%@page import="org.brickred.socialauth.util.Constants"%&gt;
  &lt;%@page import="org.apache.shiro.SecurityUtils"%&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Current Page Title&lt;/title&gt;
      &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /&gt;
      &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/init.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/handler.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/errorMsgs.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/globalHelper.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/request.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div data-role="page" id="loginPage"&gt;
          &lt;div data-theme="a" data-role="header"&gt;
              &lt;h3&gt;Login&lt;/h3&gt;
          &lt;/div&gt;
          &lt;div data-role="content"&gt;
  
              &lt;!-- Display if the user is logged in or not --&gt;
              &lt;h3&gt;&lt;%=SecurityUtils.getSubject().isAuthenticated()
                      ? "Username: " + SecurityUtils.getSubject().getPrincipal()
                      : "Currently not logged in"%&gt;&lt;/h3&gt;
  
              &lt;h3&gt;Login with existing account:&lt;/h3&gt;
              &lt;a data-role="button" data-transition="fade" data-theme="a"
                  href="auth?provider=&lt;%=Constants.FACEBOOK%&gt;" data-ajax="false"
                  data-icon="arrow-r" data-iconpos="right"&gt; Facebook &lt;/a&gt; &lt;a
                  data-role="button" data-transition="fade" data-theme="a"
                  href="auth?provider=&lt;%=Constants.GOOGLE%&gt;" data-ajax="false"
                  data-icon="arrow-r" data-iconpos="right"&gt; Google &lt;/a&gt; &lt;a
                  data-role="button" data-transition="pop" data-theme="b"
                  href="#authcLogin" data-icon="arrow-r" data-iconpos="right"&gt; Use
                  custom account &lt;/a&gt;
              &lt;div data-role="collapsible-set" data-theme="" data-content-theme=""&gt;
                  &lt;div data-role="collapsible" data-collapsed="true"&gt;
                      &lt;h3&gt;Other account providers&lt;/h3&gt;
  
                          &lt;!-- The following order of the oAuth services is based on usage statistics --&gt;
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.YAHOO%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; Yahoo &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.TWITTER%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; Twitter &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.LINKEDIN%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; Linkedin &lt;/a&gt; 
  
                          &lt;a 
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.OPENID%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; OpenID &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.HOTMAIL%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; Hotmail &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.FOURSQUARE%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; FourSquare &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.YAMMER%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; Yammer &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.MYSPACE%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; MySpace &lt;/a&gt; 
  
                          &lt;a
                          data-role="button" data-transition="fade" data-theme="a" href="/auth?provider=&lt;%=Constants.SALESFORCE%&gt;" data-ajax="false"
                          data-icon="arrow-r" data-iconpos="right"&gt; Salesforce &lt;/a&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;a data-role="button" data-transition="pop" data-theme="e"  href="#registerPage" data-icon="arrow-r" data-iconpos="right"&gt; Register new account &lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div data-role="page" id="authcLogin"&gt;
          &lt;div data-theme="a" data-role="header"&gt;
              &lt;h3&gt;Login&lt;/h3&gt;
              &lt;!-- Backbutton --&gt;
              &lt;a data-role="button" data-direction="reverse" data-rel="back" data-transition="pop" data-theme="e" href="loginPage"
                  data-icon="arrow-l" data-iconpos="left"&gt; Back &lt;/a&gt;
          &lt;/div&gt;
          &lt;div data-role="content"&gt;
              &lt;form id="logFrm" class="ui-body ui-body-a ui-corner-all"&gt;
                  &lt;fieldset&gt;
                      &lt;div data-role="fieldcontain"&gt;
                          &lt;label for="uIdInput"&gt;Email:&lt;/label&gt; 
                          &lt;input name="&lt;%=User.USER_ID%&gt;" id="uIdInput" value="" type="email" placeholder="your.mail@abc.com" /&gt; &lt;label for="uPwInput"&gt;Password:&lt;/label&gt;
                          &lt;input name="&lt;%=BasicAuthRedirectServlet.PASSWORD%&gt;" id="uPwInput" value="" type="password" placeholder="Your password" /&gt;
                      &lt;/div&gt;
                      &lt;button id="logBtn"data-theme="b"&gt;Login&lt;/button&gt;
                  &lt;/fieldset&gt;
              &lt;/form&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div data-role="page" id="registerPage"&gt;
          &lt;div data-theme="a" data-role="header"&gt;
              &lt;h3&gt;Create account&lt;/h3&gt;
              &lt;!-- Backbutton --&gt;
              &lt;a data-role="button" data-direction="reverse" data-rel="back" data-transition="pop" data-theme="e" href="loginPage"
                  data-icon="arrow-l" data-iconpos="left"&gt; Back &lt;/a&gt;
          &lt;/div&gt;
          &lt;!-- Registration --&gt;
          &lt;div data-role="content"&gt;
              &lt;div data-role="content"&gt;
                  &lt;form id="regFrm" class="ui-body ui-body-a ui-corner-all"&gt;
                      &lt;fieldset&gt;
                          &lt;div data-role="fieldcontain"&gt;
                              &lt;label for="rUIdInput"&gt;Email:&lt;/label&gt;
                              &lt;input name="&lt;%=User.USER_ID%&gt;" id="rUIdInput" value="" type="email" placeholder="your.mail@abc.com" /&gt; 
                              &lt;label for="rUPwInput"&gt;Password:&lt;/label&gt;
                              &lt;input name="&lt;%=BasicAuthRedirectServlet.PASSWORD%&gt;" id="rUpwInput" value="" type="password" placeholder="Your password" /&gt;
                          &lt;/div&gt;
                          &lt;button id="regBtn" data-theme="b"&gt;Register&lt;/button&gt;
                      &lt;/fieldset&gt;
                  &lt;/form&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;script&gt;
      function goBack() {
          window.history.back()
      }
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>