Add/Remove Image Dynamically from Controls in Google Maps V3 - image

Question

Greetigns Everyone,
I am working on a little application that will add and remove an image of a squirrel to a Google Maps application’s controls (http://www.geogodesigns.com/projects/squirrel/indexTest.html). Strange, yes, I know.
If you check out the site you will see that I can add and remove the squirrel just fine by clicking the 'Squirrel' button. However, subsequent additions and subtractions of the squirrel cause the little critter to scurry down the map. Hmmm...
What I want is for the squirrel to stay in the same place, just under the Google basemap controls, each and every time I click the 'Squirrel' button. This has been a tough nut to crack.
(function() {
window.onload = function() {
var chicago = new google.maps.LatLng(41.850033, -87.6500523);
var myOptions = {
zoom: 10,
center: chicago,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map"), myOptions);
var homeControlDiv = document.createElement('DIV');
var homeControl = new HomeControl(homeControlDiv, map);
homeControlDiv.index = 1;
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(homeControlDiv);
};
})();
function HomeControl(controlDiv, map) {
controlDiv.style.padding = '5px';
var controlUI = document.createElement('DIV');
controlUI.style.backgroundColor = 'white';
controlUI.style.borderStyle = 'solid';
controlUI.style.borderWidth = '2px';
controlUI.style.cursor = 'pointer';
controlUI.style.textAlign = 'center';
controlUI.title = 'Show squirrel';
controlDiv.appendChild(controlUI);
var controlText = document.createElement('DIV');
controlText.style.fontFamily = 'Arial,sans-serif';
controlText.style.color = 'black';
controlText.style.fontSize = '12px';
controlText.style.paddingLeft = '4px';
controlText.style.paddingRight = '4px';
controlText.innerHTML = '<b>Squirrel</b>';
controlUI.appendChild(controlText);
var imageDiv = document.createElement('DIV');
imageDiv.setAttribute('id','imageDiv');
google.maps.event.addDomListener(controlUI, 'click', function() {
if(document.getElementById('image')){
controlUI.style.backgroundColor = 'white';
controlText.style.color = 'black';
var oldimage = document.getElementById('image');
imageDiv.removeChild(oldimage);
}
else{
controlUI.style.backgroundColor = 'black';
controlText.style.color = 'white';
var image = document.createElement('IMG');
image.setAttribute('id','image');
image.src = 'http://www.geogodesigns.com/projects/squirrel/img/squirrel.jpg';
imageDiv.appendChild(image);
map.controls[google.maps.ControlPosition.RIGHT].push(imageDiv);
}
});
}

Answer 1

Add the last line.
if(document.getElementById('image')){
controlUI.style.backgroundColor = 'white';
controlText.style.color = 'black';
var oldimage = document.getElementById('image');
imageDiv.removeChild(oldimage);
map.controls[google.maps.ControlPosition.RIGHT].pop(oldimage);
}