function process()
{
  // create the <p> element
  oP = document.createElement("p");
  // create the "Hello..." text node
  oHelloText = document.createTextNode
    ("Hello dude! Here's a cool list of colors for you:");
  // add the text node as a child element of <p>
  oP.appendChild(oHelloText);

  // create the <ul> element
  oUl = document.createElement("ul")

  // create the first <li> element and add a text node to it
  oLiBlack = document.createElement("li");
  oBlackText = document.createTextNode("Black");
  oLiBlack.appendChild(oBlackText);

  // create the second <li> element and add a text node to it
  oLiOrange = document.createElement("li");
  oOrangeText = document.createTextNode("Orange");
  oLiOrange.appendChild(oOrangeText);

  // create the third <li> element and add a text node to it
  oLiPink = document.createElement("li");
  oPinkText = document.createTextNode("Pink");
  oLiPink.appendChild(oPinkText);

  // add the <ui> elements as children of the <ul> element
  oUl.appendChild(oLiBlack);
  oUl.appendChild(oLiOrange);
  oUl.appendChild(oLiPink);

  // obtain a reference to the <div> element on the page
  myDiv = document.getElementById("myDivElement");

  // add the <p> and <ul> elements to the <div> element
  myDiv.appendChild(oP);
  myDiv.appendChild(oUl);
}
