[jQuery] $('body') problem in FireFox
Hi,
I am trying to make a search-term highlight script extension work on
the body element of a page. However, the following code causes a VERY
weird problem in FF2 and FF3. The complete body seems to be removed
after the script runs...
[code]
var hlst_query = new Array
("array","of","dynamically","inserted","terms");
jQuery.fn.extend({
highlight: function(search, insensitive, span_class){
var regex = new RegExp('(<[^>]*>)|(\\b'+ search.replace(/([-.*+?^
${}()|[\]\/\\])/g,'\\$1') +')', insensitive ? 'ig' : 'g');
return this.html(this.html().replace(regex, function(a, b, c){
return (a.charAt(0) == '<') ? a : '<span class=\"'+ span_class
+'\">' + c + '</span>';
}));
}
});
jQuery(document).ready(function($){
if(typeof(hlst_query) != 'undefined'){
for (i in hlst_query){
$('body').highlight(hlst_query[i], 1, 'hilite term-' + i);
}
}
});
[/code]
In IE it all works fine, in Opera the spans are added but after that
the test page does not take any user input anymore...
If I redefine $('body') to be something like $('#content') referring
to a div with ID content, it works in all browsers but ofcource ONLY
inside that div...
Is there a way to make it work for all browsers for the COMPLETE body?
I cannot assume the body has an ID because this script is supposed to
run on different templates...
I tried a lot already but wihtout any results. Please help :)