There seems to be an error in this logic (swapped is set to false on document load), i.e.

   if (!event)
      event = window.event;

   if (!event.target)
      event.target = event.srcElement;

   var enlargeIndicator = event.target.swapped
                          ? document.createTextNode('green')
                          : document.createTextNode('blue');
   var shrinkIndicator  = event.target.swapped
                          ? document.createTextNode('blue')
                          : document.createTextNode('green');

   var spans = document.getElementsByTagName('span');
   for (var i = 0; i < spans.length; i++)
   {
      if (spans[i].className == 'button')
      {
         spans[i].previousSibling.replaceChild(enlargeIndicator, spans[i].previousSibling.firstChild);
         spans[i].nextSibling.replaceChild(shrinkIndicator,      spans[i].nextSibling.firstChild);
      }
   }

   event.target.swapped = !event.target.swapped;

since a call to this function first swaps the checkmarks [as intended] but then removes the nodes when replacing the next set.

Using removeChild and appendChild instead, i.e.

   if (!event)
      event = window.event;

   if (!event.target)
      event.target = event.srcElement;

   var enlargeIndicator = event.target.swapped
                          ? document.createTextNode('green')
                          : document.createTextNode('blue');
   var shrinkIndicator  = event.target.swapped
                          ? document.createTextNode('blue')
                          : document.createTextNode('green');

   var spans = document.getElementsByTagName('span');
   for (var i = 0; i < spans.length; i++)
   {
      if (spans[i].className == 'button')
      {
         spans[i].previousSibling.removeChild(spans[i].previousSibling.firstChild);
         spans[i].previousSibling.appendChild(enlargeIndicator);

         spans[i].nextSibling.removeChild(spans[i].nextSibling.firstChild);
         spans[i].nextSibling.appendChild(shrinkIndicator);
      }
   }

   event.target.swapped = !event.target.swapped;

has the same result. Try it out by clicking the buttons below (clicking once more pops up an alert with the error message). It should be noted that the last nodes remain in the document and are swapped as intended when the alert box is confirmed. This behaviour has been observed in Firefox, Opera, Konqueror, safari and m$ xPloder

It gets even more interesting when we try to change a style property on the object such as background-color. Observe how the childNode is first replace or removed/appended, an error alert pops up and dismissing that finally removes the node.

The structure of the document fragment above is as follows:

   <div class="buttonGroupWrapper">
      <div class="buttonWrapper">
         <span class="radioCaption">enlarge</span>
         <span class="indicator">green</span>
         <span class="button"
               onclick="function(event) { toggle1(event); }">replace markers</span>
         <span class="indicator">blue</span>
         <span class="radioCaption">shrink</span>
      </div>
   </div>

   <div class="buttonGroupWrapper">
      <div class="buttonWrapper">
         <span class="radioCaption">enlarge</span>
         <span class="indicator">green</span>
         <span class="button"
               onclick="function(event) { toggle2(event); }">remove/append markers</span>
         <span class="indicator">blue</span>
         <span class="radioCaption">shrink</span>
      </div>
   </div>