jQuery not replacing text in ReportViewer

Question

I'm trying to replace text that I got back in the ReportViewer using jQuery. My div, wrapped in the table cell, display "empty" as text - which I plan on replacing with my own formatted text on the client side.

I can use jQuery just fine to set a class on the div (which is inside a td element). Example:

jQuery('div:contains("empty")').addClass('replacetext');

But for some reason I cannot do this:

jQuery('div:contains("empty")').replaceWith('<div>Hello World</div>');

I tried this out on some other elements on the page and jQuery does work... but it seems like this issue is ReportViewer (I'm using 2008) specific.

Answer 1

The key problem I encountered was a bit different from the question.

The way I was setting the class - the selector was general and the table was nested with a soup of divs and tables and rows. Many of which are uncessary but blame that on the ReportViewer.

So the solution is specificity which is what I used to select the level at a very granular level:

jQuery(document).ready(function() {
    jQuery('#container table table div:contains("empty")').addClass('persistent');
});

And I used a style, to mark the guilty since I have the horror of working with IE6 and the dev toolbar is not up to par with firebug.

.persistent {
    background-color: Yellow;   
}

It was hard to pinpoint the error since I was had another jQuery at the top of the script which I didn't notice that was messing up the logic.