CSS won't apply to elements inside innerHtml

egy4host.com

New Member
I am using jQuery's mobile css and js. I am using Facebook API as well. The css styling works great if the element is defined in the physical code: \[code\]<div class= "ThisStuffIsStlying"> </div>\[/code\]But when I get data back from Facebook's API and then try to use jQuery \[code\]innerHtml()\[/code\] to display that information, it displays the information perfectly, but it does not style according to the CSS for some reason. I have checked the page's source using a browser and everything such as id names, class names, attributes, etc, seem to be rendered perfectly, but for some reason it will not style. I have no idea why this is or how to fix it?\[code\]<!DOCTYPE html><html lang="en" xmlns:fb="https://www.facebook.com/2008/fbml"> <head> <script src="http://stackoverflow.com//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /> <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script> <meta charset="utf-8" /> <title>Facebook API - Get friends list | Script Tutorials</title> </head> <body> <div id="result_area"></div> <div id="fb-root"></div> <div class="ThisStuffIsStlying"></div> <script> $(document).ready(function () { //FACBOOK API STUFF FB.api('/me', function (response) { var result_holder = document.getElementById('result_area');.... var results = ''; for (var i = 0; i < data_objectstuff.length; i++) { results += '<div class="ThisIsNotStyling">....stuffff..... </div> } // PRINT THE RESULT, THIS STUFF WONT STYLE result_holder.innerHTML = results+' < /ul>'; </script> </body> </html>\[/code\]
 
Back
Top