What I’m doing is I have an intermediate page setup that acts as a hub for other pages, these other pages can be specified either statically (inside the hub page) or dynamically by supplying a url which then goes into an AJAX call.
My problem comes in with Safari and Safari alone. When the url’d page has <style>s, my script selects them all out and puts them inside <head> of the hub page because that’s where they’re supposed to be, and the rest of the page is selected for by a wrapper and is loaded into the hub. Safari doesn’t like to see the new styles. And safari doesn’t see them if I leave them as they were inside the <div>.
So what I’m looking for is a workaround for this to make Safari see there are styles specified for the classes. I’ve tested Firefox4, Chrome, Opera, and even Internet Explorer 9 and they all work.
Example as requested: (this is inside an ajax complete function)
responseText = jqXHR.responseText;
var dummy = $("<div></div>");
$('head').append(dummy.html(responseText).find("style"));
Gregg, I just tried the following, in a safari interactive console
which then turned all of the text on the page to white. So, my suggestion is to dynamically create the style tag, append it, and then add in the text from the other style tag.
I think this is likely to do what you want.