IE8 vs. jQuery 1.3.2 and elements on the fly

IE is back to its old tricks again. My page works fine in Safari 4 and FF3+ but does not in IE8. I’m using jQuery 1.3.2, soon to upgrade to 1.4.

I’m using Google Maps to show some locations. I can create the info bubble just fine and the “Get Directions” span with a class of .directions. It’s supposed to insert some elements above the map to allow the user to input their address and zip and then get directions. Those elements never show up in IE8. The alert doesn’t even pop up (I put it there for testing). So IE8 doesn’t support the .live() method in jQuery??

//driving directions link
	$('.directions').live('click', function(){
		if ($('div[id=from]').length == 0) {
			.before('<div id="from"></div>');
			.append('<p>Enter the address and zip code of where you are traveling from.</p>')
			.append('<div><label for="street">Street:</label><input type="text" id="street" /></div>')
			.append('<div><label for="zip">Zip:</label><input type="text" id="zip" maxlength="5" /></div>')
			.append('<div><input type="button" id="getroute" value="Get Route!" /></div>');
			$('#getroute').css('marginLeft', '70px');
		if ($('#busaddress').length == 0) {
			$('#map_canvas').after('<input type="hidden" id="busaddress" value="'+$(this).attr('title')+'" />');
		} else {
	//create route
	$('#getroute').live('click', function(){
		//console.log('clicked getroute');
		.after('<div id="route"></div>');
		initialize($(lats[0]).text(), $(longs[0]).text(), 12, true);

live() works with ie. Your problem is elsewhere. I would do some more thorough debugging.

Sometimes it can be useful to try to create a minimal example that exhibits the behavior. The process of progressively stripping out unnecessary things often reveals the answer.