Scripts Tags Get Moved Only During Window DOM Node HTML Injection 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title>jQuery And Script Tags With AJAX Data</title>
	<script type="text/javascript" src="jquery-1.3.2.js"></script>
	<script type="text/javascript">
 
		// I am a jquery plugin that looks for script tags of class
		// meta-data and applies the JSON to its parent element in
		// the metaData key.
		jQuery.fn.applyMetaData = function(){
			// Find all the embedded script meta-data tags and
			// iterate of them to individually apply them to the
			// direct parent node.
			this.find( "script.meta-data" ).each(
				function( nodeIndex, scriptTag ){
					var script = $( this );
					var parent = script.parent();
					var metaData = {};
 
					// Try to evaluate the JSON meta data.
					try {
						metaData = eval( "(" + script.html() + ")" );
					} catch ( error ){
						// JSON was not valid.
					}
 
					// Store meta data into parent.
					parent.data(
						"metaData",
						jQuery.extend(
							{},
							parent.data( "metaData" ),
							metaData
							)
						);
				}
				)
 
				// Once the script tags have been processed,
				// remove them from the DOM.
				.remove()
			;
 
			// Return the collection without the script tags.
			return( this.not( "script.meta-data" ) );
		}
 
 
		// I handle the html data response from the AJAX request.
		function populate( htmlData ){
			var html = $( htmlData ).applyMetaData();
 
			// Put HTML into DOM.
			$( "#list" )
				.empty()
				.append( html )
			;
 
			// Bind click handlers.
			$( "#list a" )
				.attr( "href", "javascript:void( 0 )" )
				.click(
					function( clickEvent ){
						// Alert parent ID.
						alert( $( this ).parent().data( "metaData" ).id );
 
						// Prevent default event.
						return( false );
					}
					)
			;
		}
 
 
		// When DOM loads, initialize.
		$(
			function(){
				// Grab the remote data via AJAX request.
				$.ajax({
					type: "get",
					url: "script3_data.htm",
					dataType: "html",
					success: populate
					});
			}
			);
 
	</script>
</head>
<body>
 
	<h1>
		jQuery And Script Tags With AJAX Data
	</h1>
 
	<ul id="list" />
 
</body>
</html>

For Cut-and-Paste