[jQuery] Round corners and jQ conversion help

[DaveG]

I'd like some improvements feedback and some verification of my
attempt to jQueryize the code here
http://www.456bereastreet.com/archive/200505/transparent_custom_corners_and_borders/

What I have seems to work just fine, but I'm concerned that I'm not
reading the original correctly.

Here's what the original code does: transforms all DIVs with the class
"cbb" into this structure:
div class="cb original_class"
      div class="bt"
      div class="i1"
            div class="i3"
            div id=original class="i3 original_class"
      div class="bb"

I'm confused as to why the original copies the original DIV classes to
the outer "cb" class. My version does not do that, and seems to have
no ill effects. What's the best way to change my version to do this,
if necessary?

Here's my jQ version:
function initCB(){
   $("div.cbb").wrap('<div class="cb"><div class="i1">'+
     '<div class="i2"></div></div></div>')
     .toggleClass("cbb").addClass("i3");
        $('div.cb')
        .prepend('<div class="bt"><div></div></div>')
        .append('<div class="bb"><div></div></div>');
}

Here's the important part of the original:
function initCB()
{
        // Find all div elements
        var divs = document.getElementsByTagName('div');
        var cbDivs = [];
        for (var i = 0; i < divs.length; i++) {
        // Find all div elements with cbb in their class attribute while
allowing for multiple class names
                if (/\bcbb\b/.test(divs[i].className))
                        cbDivs[cbDivs.length] = divs[i];
        }
        // Loop through the found div elements
        var thediv, outer, i1, i2;
        for (var i = 0; i < cbDivs.length; i++) {
        // Save the original outer div for later
                thediv = cbDivs[i];

        //      Create a new div, give it the original div's class attribute, 
and
replace 'cbb' with 'cb'
                outer = createElement('div');
                outer.className = thediv.className;
                outer.className = thediv.className.replace('cbb', 'cb');

        // Change the original div's class name and replace it with the new
div
                thediv.className = 'i3';
                thediv.parentNode.replaceChild(outer, thediv);

        // Create two new div elements and insert them into the outermost div
                i1 = createElement('div');
                i1.className = 'i1';
                outer.appendChild(i1);
                i2 = createElement('div');
                i2.className = 'i2';
                i1.appendChild(i2);

        // Insert the original div
                i2.appendChild(thediv);

        // Insert the top and bottom divs
                insertTop(outer);
                insertBottom(outer);
        }
}


 ~ ~ Dave

- - - - - - - - - - -
Here's the original support functions for reference:

function createElement(element) {
        if (typeof document.createElementNS != 'undefined') {
                return document.createElementNS('http://www.w3.org/1999/xhtml',
element);
        }
        if (typeof document.createElement != 'undefined') {
                return document.createElement(element);
        }
        return false;
}

function insertTop(obj) {
        // Create the two div elements needed for the top of the box
        d=createElement("div");
        d.className="bt"; // The outer div needs a class name
    d2=createElement("div");
    d.appendChild(d2);
        obj.insertBefore(d,obj.firstChild);
}

function insertBottom(obj) {
        // Create the two div elements needed for the bottom of the box
        d=createElement("div");
        d.className="bb"; // The outer div needs a class name
    d2=createElement("div");
    d.appendChild(d2);
        obj.appendChild(d);
}