Interacts with AJAX Templates set up in ExpressionEngine. Functionality can obviously be changed to allow Lazy Loading, but this is the basic set up for future referencing.

JS: EE Ajax Load

$('body').delegate('.load-more', 'click', function(e){

  //Vars
	var 
		me 			= $(this),
		target			= me.attr('href'),
		split 			= target.split('/'),
		offset 			= split[split.length-1],
		new_target 		= '',
		container 		= me.attr('data-container'),
		request 		= $.ajax({url: target});

		/*
		If no container has been set, we don't know
		where to place the retrieved content, so fire
		an error to remind us to do that!
		*/
		if( container == null || container == undefined || container == '' || !$(container) > 0 ){
			alert('Target container either not found or not defined.');
			return false;
		}

		//Spin it round
		me.addClass('loading');

		//Done
		request.done(function(response) {

			//Has articles
			if(response.match(/<TAG_TO_LOOK_FOR>/g) != null){

				new_target 	= target.substring(0, target.length - offset.length) + (parseInt(offset) + 8);
				me.attr('href', new_target);

				//Standard load in
				$(container).append(response);

			}

			//Doesn't have articles
			else{

				me.before('<p>No more results</p>').remove();

			}

			//No more spinny
			me.removeClass('loading');

		});

		//Failed
		request.fail(function(jqXHR, textStatus) {
			
			alert( "Request failed: " + textStatus );

		});

	return false;

});