"Cannot read property 'zindex' of undefined" Google maps

I had the same error pop up on my console whilst following the tutorial for a different reason.

Rather than using default javascript DOM manipulation, I'd been using jQuery to create my elements, e.g.

    var controlDiv = $('<div></div>');
    var controlUI = $('<div class="alert alert-info"></div>');
    controlDiv.append(controlUI);
    var controlText = $('<div>Control text here</div>');
    controlUI.append(controlText);

Doing this is fine, so long as you give the DOM node to the map (and not the jQuery element!) at the end, using controlUI[0] or controlUI.get(0), like this:

    map.controls[google.maps.ControlPosition.TOP_RIGHT].push(controlDiv[0]);

See also:
How to get the native DOM element from a jQuery object - jQuery FAQ

I followed the tutorial, which is very close to your code.

This line near the end needs to change

var churchControlDiv = new ChurchControl(churchControlDiv, map);

Replace churchControlDiv with churchControl or another name because churchControlDiv should not be overwritten.

See here http://jsfiddle.net/FTjnE/2/

I marked my changes with //CHANGED an alert for the click, and new map center