//THIS DEPENDS ON A GLOBAL VARIABLE
  //SO IN THE HEAD TAG PLEASE ADD THIS: var imgPath = '${site.staticBase}';
  var ladderImgPaths = {fl: 'fin.gif',hl: 'hr.gif', ll: 'law.gif', ml: 'mktg.gif', ol: 'ops.gif', sl: 'sales.jpg',tl: 'tek.jpg',ul: 'up.jpg'};
  var tempRadioId;

  function setUpImagesOnclicks()
  {
    var tempEls = getElementsByClassName('signupFormRowLaddersCustomHeight', null, 'div');
    var tempInputs = tempEls[0].getElementsByTagName('input');
    for(i = 0; i < tempInputs.length; i++)
    {
      YAHOO.util.Event.addListener(tempInputs[i], "click", animateLogoDiv, this);
      if(tempInputs[i].checked)
        animateLogoDiv(tempInputs[i])
    }
  }
  function animateLogoDiv(anInputId)
  {
    //Tricky: this.id can't be used to set set up the img when page is loading in case one radio is checked, in this case
    //anInputId is a mouse event, then I need to check for the type
    if(anInputId.type == 'click')
      tempRadioId = this.id;
    else
      tempRadioId = anInputId.id;
    fadeOut();
  }
  function fadeOut()
  {
    var animLogo;
    animLogo = new YAHOO.util.Anim( $('signupFormLogoDiv'), { opacity: {to: 0 } }, .5, YAHOO.util.Easing.easeIn);
    animLogo.onComplete.subscribe(swapImgSrc);
    animLogo.onComplete.subscribe(fadeIn);
    animLogo.animate();
  }
  function fadeIn()
  {
    var animLogo;
    animLogo = new YAHOO.util.Anim( $('signupFormLogoDiv'), { opacity: {to: 1 } }, .75, YAHOO.util.Easing.easeOut);
    animLogo.animate();
  }
  function swapImgSrc()
  {
    //getting the image within the div, imgEl is an array
    var imgEl = $('signupFormLogoDiv').getElementsByTagName('img');
    for(var i in ladderImgPaths)
    {
      if(tempRadioId == i)
        imgEl[0].src = imgPath + 'images/TheLadders/topaz/logos/partners/logos_' + ladderImgPaths[i];
    }
  }