/* Function that applies text gloss effect to an element. */
function applyTextGlossToElement(el, options) {
 if (options == undefined) options = {};
 if (options.bgColor == undefined) {
  /* <span> background color not specified,
  ** get background color from target element or assume white
  */
  options.bgColor =
   el.style.backgroundColor != undefined && el.style.backgroundColor
   ? el.style.backgroundColor
   : '#FFFFFF';
 }
 /* Create and append <span> as child to target element. */
 var span = document.createElement('span');
 el.appendChild(span);

 /* Use .style.cssText to effectively apply styles.
 ** It works on all major browsers.
 ** .setAttribute() does different thing in IE.
 */
 el.style.cssText = el.style.cssText + ';position:relative;';
 span.style.cssText = ';position:absolute;top:0;left:0;'
       + 'height:45%;'
       + 'width:100%;'
       + 'background-color:' + options.bgColor + ';'
       + 'filter:alpha(opacity=60);-moz-opacity:0.60;opacity:0.60;';
}
/* Function that applies text gloss effect to an array of elements. */
function applyTextGlossToElements(elements, options) {
 for (var i = 0, count = elements.length; i < count; i++) {
  applyTextGlossToElement(elements[i], options);
 }
}
window.onload = function(){
 /* Apply effect to single element */
 applyTextGlossToElement(document.getElementById('title'));
 /* Apply effect to multiple elements */
 //applyTextGlossToElements(document.getElementsByTagName('h4'));
}