Load external header and footer html with jQuery

gistfile1.txt

/*
####################################################################
Include External Header & Footer -----------------------------------
# external server needs to have CORS - enabled https://enable-cors.org/
# more examples - https://www.tutorialrepublic.com/jquery-tutorial/jquery-ajax-load.php
####################################################################
*/
$(document).ready(function() {

	// Give the body a class so that you can write styles to target the page
	$("body").addClass('externalhf');

	// Add placeholders for header and footer html
	$("body").prepend('<div id="externalhfHeader"></div>');
	$("body").append('<div id="externalhfFooter"></div>');

	// load header html
	$( "#externalhfHeader" ).load( "//www.externalsite.com/include-hf/header.html?v=1", function() {
		console.log( "external header loaded" );
	});

	// includes/footer-nav.html
	$( "#externalhfFooter" ).load( "//www.externalsite.com/include-hf/footer.html?v=1", function() {
		console.log( "external footer loaded" );
	});

	// load external styles
	$("head").append('<link rel="stylesheet" href="//www.externalsite.com/include-hf/nav.css" type="text/css"/>');

//END DOC READY
});