Integrate blog feed into static page with javascript

blog-integration.html

<p>This is a test page - please return to the <a href="https://portsmouth.greenparty.org.uk">home page</a> to continue</p>
<div id="posts">Loading...</div>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="https://portsmouth.greenparty.org.uk/assets/js/local_parties/portsmouth/wpapi/wpapi.js"></script>
<script type="text/javascript">// <![CDATA[
var wp = new WPAPI({endpoint: 'https://greenpompey.org.uk/shades-of-green/wp-json'});

var blogName = "Shades of Green"

wp.posts().get(function( err, data ) {
    if ( err ) {
        // handle err
		$("#posts").html(err);
    }
    $("#posts").html("");

    // do something with the returned posts
	for (i = 0; i < data.length; i++)
	{
		var post = data[i];
		var postdiv = $('<div>');

		var heading = $('<h2>'+ blogName +': </h2>');
		var headingLink = $('<a />');
		headingLink.html(post.title.rendered);
		headingLink.attr("href", post.link)
		heading.append(headingLink);
		postdiv.append(heading);

		//Convert html fragment into valid html
		var html = post.content.rendered.split('<!--more');
		var dom = $('<div />').append($($.parseHTML(html[0])));

		postdiv.append(dom);

		//Handle meta data and read more link
		var date = new Date(post.date);
		var meta = $('<p>Posted at '+date.toString()+' </p>');
		if(html.length > 1)
		{
			meta.append($("<a>Read more...</a>").attr("href", post.link))		
		}
		postdiv.append(meta);

		$("#posts").append(postdiv);
	}
});
// ]]></script>
<p><em>The views and opinions expressed in this blog are those of the authors and do not necessarily reflect the official policy or position of any other party, agency, organization, employer or company.</em></p>