javascript - Ajax load div , part of CSS not working -

I am using AJAX to load a div content, but div is not taking css of content page.

Example: - This link

  & lt; A href = "#" onclick = "javascript: loadAjax ('test.html')" & gt; Test & LT; / A & gt; & Lt; Div id = "result" & gt; & Lt; Table class = "table" & gt; & Lt; Thead & gt; & Lt; TR & gt; & Lt; Th & gt; Header 1 & lt; / Th & gt; & Lt; Th & gt; Header 2 & lt; / Th & gt; & Lt; / TR & gt; & Lt; / Thead & gt; & Lt; Tbody & gt; & Lt; Tr & gt; & Lt; Td> Record 1 & lt; / Td> & Lt; TD & gt; DC1 & lt; / Td> & Lt; / Tr & gt; & Lt; / Tbody & gt; & Lt; / Table & gt; & Lt; / Div & gt;  

In my CSS:

  table. T. Limit: 1 px solid #fff; Font size: 8pt; Padding: 4px; } Table.tablesorter thead tr .header {background-image: url (bg.gif); Repeat Background: No Repetition; Background-position: center right; Cursor: indicator; }  

In my test.html, this is the same table with different records:

   Record 2 & lt; / Td> & Lt; TD & gt; DC 2 & lt; / Td> & Lt; / Tr & gt; & Lt; / Tbody & gt; & Lt; / Table & gt;  

The problem I am facing is "CSS", before loading "test.html", CSS is OK. But, after clicking on that link, which looks to load test.html, CSS background still shows but "cursor: pointers" and "background image" no longer work.

What should I do to do this work? thank you in advanced!

Added to LoadEx Code:

  var http_request = false; Function load ajax (url, parameter) {http_request = false; If (window.XMLHttpRequest) {// Mozilla, Safari, ... http_request = new XMLHttpRequest (); If (http_request.overrideMimeType) {// set type //http_request.overrideMimeType ('text / xml') according to estimated content type; Http_request.overrideMimeType ('text / html'); }} And try (window.ActiveXObject) {// IE {http_request = new ActiveXObject ("Msxml2.XMLHTTP"); } Hold (e) {try {http_request = new ActiveXObject ("Microsoft.XMLHTTP"); } Hold (e) {}}} if (! Http_request) {Warning ('Can not create XMLHTTP example'); return false; } Http_request.onreadystatechange = alertContents; Http_request.open ('GET', url + parameter, true); Http_request.send (zero); } Function Alert Content () {if (http_request.readyState == 4) {// Alerts (http_request.status); If (http_request.status == 200) {//alert(http_request.responseText); Results = http_request.responseText; Document.getElementById ('Result'). InnerHTML = Results; } And {warnings ('There was a problem with the request.'); }}}  

test.html Try adding a single CSS to the file. If you are actually using an iframe or embeding one page in another, then the CSS will not confiscate in the embedded page. It is provided in the form of your document

Update: It seems that you may need to add a class to the first cell in the line so that it can be styled. Test.html does not contain any element that is styled from the second section of CSS because it does not match any element.

  & lt; Table class = "table" & gt; & Lt; Thead & gt; & Lt; TR & gt; & Lt; Th & gt; Header 1 & lt; / Th & gt; & Lt; Th & gt; Header 2 & lt; / Th & gt; & Lt; / TR & gt; & Lt; / Thead & gt; & Lt; Tbody & gt; & Lt; Tr & gt; & Lt; Td square = "header" & gt; Record 2 & lt; / Td> & Lt; TD & gt; DC 2 & lt; / Td> & Lt; / Tr & gt; & Lt; / Tbody & gt; & Lt; / Table & gt;