Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Instead of improving my other answer, I'd rather make a new one since I basically need to re-write it to work with how you want it and the old answer may help people for other reasons...</p> <p>So, after extracting out the HTML-string from the XML you link to, you can go forth with it like this:</p> <pre><code>// First we'll extract out the parts of the HTML-string that we need. var jq_html = $(html_from_xml); var style = jq_html.find('head').find('style').html(); var style_string = style.toString(); var table_and_stuff = jq_html.find('body').html(); // If you want to place it into the existing page's DOM, // we need to place it inside a new DIV with a known ID... $('body').append('&lt;div id="new_stuff"&gt;&lt;/div&gt;'); $('#new_stuff').html(table_and_stuff); // Now, we need to re-write the styles so that they only // affect the content of the 'new_stuff' DIV: styles_array = style_string.split('}'); var new_styles = ''; $.each(styles_array,function(i) { if(i&lt;(styles_array.length-1)) { new_styles += "#new_stuff "+styles_array[i]+"}"; } }) $('head').append('&lt;style type="text/css"&gt;'+new_styles+'&lt;/style&gt;'); </code></pre> <p>And that should really do it. The trick is that CSS will choose the most specific style for the case. So, if you have a <code>&lt;td&gt;</code> inside the "newstuff" div, it will get the style from the new stylesheet. If you have a <code>&lt;td&gt;</code> outside of that "newstuff" div, it will get the old style. </p> <p>I hope this solves your problem.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload