Prototype Remove HTML ?

Question

Hi Guys,

I have the following HTML

<div id="top-right">
<span id="top-right-name">sometexthere</span> | <a href="#">link</a>
</div>

And the following prototype JS

   Event.observe(window, 'load', function() {
try { 
if ($$('#top-right')!=null) {

var topmenu = document.getElementById('top-right');
var value = topmenu.innerHTML;
// define an array of replacements
var replacements = [
    { from: '|', to: ' ' },
    { from: '|', to: ' ' },
    { from: '|', to: ' ' },
    { from: '|', to: ' ' }
];
for (var i = 0, replacement; i < replacements.length, replacement = replacements[i]; i++) {
    // replace
    value = value.replace(replacement.from, replacement.to);
}
// replace the old text with the new
topmenu.innerHTML = value;  

}
} 
catch(ex) {
}
});

I am trying to remove the " | " after the </span> automatically onload of the this JS - but I just cant seem to do it .

Can someone assist ?

Thanks

Answer 1

It seems to be a syntax error somewhere, perhaps in your loading of Prototype. The below snippet worked fine for me :)

<script type="text/javascript" 
    src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"&gt;&lt;/script&gt;

<div id="top-right">
<span id="top-right-name">sometexthere</span> | <a href="#">link</a>
</div>

<script type="text/javascript">
Event.observe(window, 'load', function() {
try { 
if ($$('#top-right')!=null) {

var topmenu = document.getElementById('top-right');
var value = topmenu.innerHTML;
// define an array of replacements
var replacements = [
    { from: '|', to: ' ' }
];
for (var i = 0, replacement; i < replacements.length, replacement = replacements[i]; i++) {
    // replace
    value = value.replace(replacement.from, replacement.to);
}
// replace the old text with the new
topmenu.innerHTML = value;  

}
} 
catch(ex) {
}
});
</script>

Edited to reflect problem