When I add an API function to my wordpress site, the <div>s after the are removed.

I'm using an include to get information from an API and displaying it in our wordpress site.

I'm new to API's and the XML but have figured how to display the information I want and got it to display into wordpress using PHP include.

However, when the API data is included, it removes all the <div> after the code.  I thought maybe something in my HTML in the include may be interfering but checking the source shows the other 2 divs after are ignored by the browser.

Is there there something in the XML that needs to be escaped or may be causing this to happen?  

here's the code:

<style type="text/css">
#event {
	postion: relative;
	margin: 5px;
	width: 290px;
	height: 50px;
}

.menu h3{
	margin: 2px;
	float: left;
}

.date-display {
	float: left;
	font-size: 18px;
	font-family: Arial, Helvetica, sans-serif;
	margin-right: 5px;
	position: relative;
}

.date-display #display-top {
	height: 20px;
	margin: 0px;
	width: 30px;
	background: #fff;
	border-radius: 5px 5px 0 0;
	border-left: solid thin #666;
	border-top: solid thin #666;
	border-right: solid thin #666;
	
	padding: 10px 15px 5px 8px;
	font-size: 1.8em;
	color: #333;
}
.date-display #display-bot {
	height: 15px;
	background: red;
	margin: 0px;
	border-radius: 0 0 5px 5px;
	border-left: solid thin #666;
	border-bottom: solid thin #666;
	border-right: solid thin #666;
	width: 30px;
	padding: 0 15px 8px 8px;
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
}
#event .menu {
	float: left;
	width: 190px;
	position: relative;
}
.menu em {
	position: relative;
	width: 160px;
	padding: 5px;
	z-index: 2;
	display: none;
	top:-10;
	float: left;
	background: #f1f1f1;
	border-radius: 5px;
	color: #444;
	box-shadow: 2px 2px 2px #333;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){

	$(".menu a").hover(function() {
		$(this).next("em").animate({opacity: "show", top: "5"}, "slow");
	}, function() {
		$(this).next("em").animate({opacity: "hide", top: "10"}, "fast");
	});


});
</script>
<?php
$credentials="";
$today = date('Y-m-d');
$end = date('Y-m-d',strtotime('+7 day'));
echo "<h1>The Next 7 Days at Cornerstone</h1>";
//$num_days = '30';
//$today= date('Y-m-d');
$ch = curl_init();
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POST, 0);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST,0); 
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER,0); 
curl_setopt($ch, CURLOPT_USERPWD, $credentials);
// get this day's public calendar listing
curl_setopt($ch, CURLOPT_URL, "https://iamcornerstone.ccbchurch.com/api.php?srv=public_calendar_listing&date_start={$today}&date_end={$end}");
$xml=@curl_exec($ch);
// bail if cannot get response from CCB
if($xml === false){
    show_empty();
    finish();
}
// the response is XML so we let php parse it
$eventlist=simplexml_load_string($xml);
// if we do not get any items back then send empty
if(! isset($eventlist->response->items->item)){
    show_empty();
    finish();
    exit;
}
$i=0;
foreach($eventlist->response->items->item as $value){
	if(++ $i <= 2) {
	$date = date('F d, Y' , strtotime($value->date));
	$datenum = date('d' , strtotime($value->date));
	$datemon = date('M' , strtotime($value->date));
	echo "<div id=\"event\">";
	echo "<div class=\"date-display\"><div id=\"display-top\">" . $datenum . "</div><div id=\"display-bot\">" . $datemon . "</div></div>";
    echo "<div class=\"menu\"><a href=\"#\"><h3>" . trim($value->event_name). "</h3></a>" . "<em style=\"top: -85px; display: none;\">" . trim($value->event_description) . "</em></div>";
	echo "</div><br style=\"clear:both\">";
}

}if($i >= 2) {
		echo "view all events this week";
	}
finish();
exit;
//
//
function show_empty(){
    //do something here to say that there were no events in the list
    echo "There are no events today.";
    return;
}
function finish(){
    echo "";
    return;
}
?>

Select allOpen in new window

I am then using <?php include('filename'); ?> in my wordpress footer to bring the info in.

Here is the live site.

www.upperlimitdesign.com/sandbox/cornerstone

thanks.