ok it would seem to me that the Client side peoplePicker seems to act a little differently to the OTB one. I'm using the following code to set it up and then update the title so it best reflects the OTB version.
// Run your custom code when the DOM is ready.
$(document).ready(function () {
// Specify the unique ID of the DOM element where the
// picker will render.
initializePeoplePicker('peoplePickerDiv');
var employee = $().SPFindPeoplePicker({
peoplePickerDisplayName: "employeePP", // The displayName of the People Picker on the form
valueToSet: $().SPServices.SPGetCurrentUser()
});
alert(employee);
for (i = 0; i < employee.dictionaryEntries.length; i++) {
alert(employee.dictionaryEntries[i].Email);
};
});
// Render and initialize the client-side People Picker.
function initializePeoplePicker(peoplePickerElementId) {
// Create a schema to store picker properties, and set the properties.
var schema = {};
schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup';
schema['SearchPrincipalSource'] = 15;
schema['ResolvePrincipalSource'] = 15;
schema['AllowMultipleValues'] = false;
schema['MaximumEntitySuggestions'] = 50;
schema['Width'] = '280px';
// Render and initialize the picker.
// Pass the ID of the DOM element that contains the picker, an array of initial
// PickerEntity objects to set the picker value, and a schema that defines
// picker properties.
this.SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);
// Now we need to change the title for SPServices
$('#peoplePickerDiv_TopSpan').attr('title', 'employeePP');
$('#peoplePickerDiv_TopSpan_EditorInput').attr('title', 'employeePP');
}
// Query the picker for user information.
function getUserInfo() {
// Get the people picker object from the page.
var peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict.peoplePickerDiv_TopSpan;
// Get information about all users.
var users = peoplePicker.GetAllUserInfo();
var userInfo = '';
for (var i = 0; i < users.length; i++) {
var user = users[i];
for (var userProperty in user) {
userInfo += userProperty + ': ' + user[userProperty] + '<br>';
}
}
$('#resolvedUsers').html(userInfo);
// Get user keys.
var keys = peoplePicker.GetAllUserKeys();
$('#userKeys').html(keys);
}