Setting CSS on a div that has just been partially refreshed via ajax
So my problem is fairly simple.
I have a div that contains some data.
Once every XX seconds I refresh it via this method
- //Partial refresh of the patients tables
$(function () {
setInterval(function () {
$('#patientGridDiv').load(location.href + " #patientGridDiv>*", "");
}, 10000);
});
So that is working nicely and does what is supposed to. However in the document ready method which is run when the page DOM is ready I set some CSS. This CSS however is lost when the partial refresh is done. So it is my intention to re do the CSS after each partial refresh.
The problem with is the timing. If I apply the CSS like this
- //Partial refresh of the patients tables
$(function () {
setInterval(function () {
$('#patientGridDiv').load(location.href + " #patientGridDiv>*", "");
SetCSS();
}, 10000);
});
It fails due to the timing. The div is simply not ready at that point in time to get styled. I know this cause if I insert an alert before the SetCSS method is gets CSS afterwards. Also if I insert a window.setTimeout(SetCSS, 1300) it works.
That is all good, that I can solve it with a timeOut. But it isn't a very elegant solution. I am looking for some event method or method that can help me so I know when the div is ready to be css'ed.
I've looked at the .ready method but that isn't working for me. I also tried some guys elementReady script, didn't help either.
So does anyone have a suggestion for me to be able to tell when the div is ready to be re-styled in a nice and dynamic way.
Thanks
Thomas