Creating a button to put tags around highlighted text in a textarea...help please

JavaScript
1

I got this code from some archive or javascript, can’t remember where. It seems to work flawless except for certain character(s) are causing it to mess up. For example, try this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="/textareainsert.js"></script>
</head>

<body>

<form>
<input type="button" onclick="addPTag(document.getElementById('text'),'strong')" value="Bold" />
<textarea name="text" id="text" rows="15" cols="85">
Here is a bunch of text that comes before the "long dash" character — and here is text that comes after it. Highlight an area of text that comes before the dash, and click the bold button. Everything after the long dash character will disappear (although the bold tags are correctly placed). Then reload this page and highlight a section of text *after* the long dash. Then it really acts strange. If you remove the dash completely, it works totally fine.
</textarea>
</form>

</body>

</html>

and here is textareainsert.js:

function getSelection(ta)
  { var bits = [ta.value,'','','']; 
    if(document.selection)
      { var vs = '#$%^%$#';
        var tr=document.selection.createRange()
        if(tr.parentElement()!=ta) return null;
        bits[2] = tr.text;
        tr.text = vs;
        fb = ta.value.split(vs);
        tr.moveStart('character',-vs.length);
        tr.text = bits[2];
        bits[1] = fb[0];
        bits[3] = fb[1];
      }
    else
      { if(ta.selectionStart == ta.selectionEnd) return null;
        bits=(new RegExp('([\\x00-\\xff]{'+ta.selectionStart+'})([\\x00-\\xff]{'+(ta.selectionEnd - ta.selectionStart)+'})([\\x00-\\xff]*)')).exec(ta.value);
      }
     return bits;
  }

function matchPTags(str)
  { str = ' ' + str + ' ';
    ot = str.split(/\\<[strong|ul|li].*?\\>/i);
    ct = str.split(/\\<\\/[strong|ul|li].*?\\>/i);
    return ot.length==ct.length;
  }

function addPTag(ta,pTag)
  { bits = getSelection(ta);
    if(bits)
      { if(!matchPTags(bits[2]))
          { alert('\	\	Invalid Selection\
Selection contains unmatched opening or closing tags.');
            return;
          }
        ta.value = bits[1] + '<' + pTag + '>' + bits[2] + '</' + pTag + '>' + bits[3];
      }
  }

Any ideas on how to fix this? I am going to guess that there are other characters that will also mess up the script, but there is probably a blanket fix that addresses this issue.

Thanks