A question regarding DOM for any gurus out there...

I am curious if this is even possible...

1. The user highlights a soem text on the page.
2. The user presses a button that automatically puts some text either side, in this case <span id="$js_var">Highlighted Text</span>
3. Using the DOM to change styles for that specific ID eg:

Code:
<script language="JavaScript">
  function makeBold()
    {

      b = document.getElementById("$js_var");

      b.style.fontWeight = "bold";

    }
</script>
Can you see where I am going with this? Is this even possible to add selected text to a new node on the fly, and also style it?

Mind you I have not used js variables before so the syntax is most probably wrong, am not interested in that part for nowe, only if changing "new" nodes on the fly is at all possible, and if so, is it cross-browser compatible?

Thanks guys...