Clear value PeoplePicker in JavaScript (JQuery)?

Question

Please tell me how to clear the value PeoplePicker in JavaScript (JQuery)? Tried a lot of examples, nothing works.

$("input[id*='Author']").val('');
$("div[id*='Author']").attr('description','');
$("div[id*='Author']").attr('displaytext','');
$("div[id*='Author']").attr('key','');

Answer 1

I don't see what you are trying to accomplish as Author is the internal name for the field Created By but here goes.

<script language="javascript" type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script src="../_layouts/15/clienttemplates.js"></script>
<script src="../_layouts/15/clientforms.js"></script>
<script src="../_layouts/15/clientpeoplepicker.js"></script>
<script src="../_layouts/15/autofill.js"></script>
<script language="javascript" type="text/javascript">

/*Finds and deletes the resolved users in the people picker control "Test" if there are more than zero user present.*/ 

$(document).ready(function() {
peoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[$('[Title*="Test"]')[0].id];
    if (peoplePicker.TotalUserCount > 0) {
        peoplePicker.DeleteProcessedUser();
    }
});
</script>

Answer 2

Following scripts works for me for ClientPeoplePicker. The DeleteProcessedUser method requires span element of resolved user.

Definition:

function removeAllUsers(peoplePickerId){
    var peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict["ctl00_PlaceHolderMain_" + peoplePickerId + '_TopSpan'];

    var selectedUsers = peoplePicker.GetAllUserInfo();
    var userToRemoveKey = selectedUsers[1].Key; 

    var resovledListElmId = peoplePicker.ResolvedListElementId;
    $('#' + resovledListElmId).children().each(function(index, element) {
        peoplePicker.DeleteProcessedUser(element);
    });
}

Usage:

removeAllUsers("PeoplePickerControlName");