In an effort to remove all jQuery dependency from one of my plugins, I decided to turn all jQuery.ajax()
requests into vanilla JavaScript requests. Turns out it’s pretty simple.
Here’s the original request, before:
jQuery.ajax({
type: 'post',
url: ipAjaxVar.ajaxurl,
data: 'action=imagepress-like&nonce=' + ipAjaxVar.nonce + '&imagepress_like=&post_id=' + pid,
success: function (count) {
if (count.indexOf('already') !== -1) {
var lecount = count.replace('already', '');
if (lecount === '0') {
lecount = ipAjaxVar.likelabel;
}
like.removeClass('liked');
like.html('<svg class="lnr lnr-heart"><use xlink:href="#lnr-heart"></use></svg> ' + lecount);
} else {
count = ipAjaxVar.unlikelabel;
like.addClass('liked');
like.html('<svg class="lnr lnr-heart"><use xlink:href="#lnr-heart"></use></svg> ' + count);
}
}
});
And here’s the vanilla JavaScript request, after:
const request = new XMLHttpRequest();
request.open('POST', ipAjaxVar.ajaxurl, true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.onload = function () {
if (this.status >= 200 && this.status < 400) {
if (this.response.indexOf('already') !== -1) {
if (this.response.replace('already', '') === '0') {
likeLabel = ipAjaxVar.likelabel;
}
like.classList.remove('liked');
like.innerHTML = '<svg class="lnr lnr-heart"><use xlink:href="#lnr-heart"></use></svg> ' + likeLabel;
} else {
likeLabel = ipAjaxVar.unlikelabel;
like.classList.add('liked');
like.innerHTML = '<svg class="lnr lnr-heart"><use xlink:href="#lnr-heart"></use></svg> ' + likeLabel;
}
} else {
// Response error
}
};
request.onerror = function() {
// Connection error
};
request.send('action=imagepress-like&nonce=' + ipAjaxVar.nonce + '&imagepress_like=&post_id=' + pid);
Tested and working.
Read more about it here (POST requests using JavaScript) and here (using XMLHttpRequest).

Technical SEO specialist, JavaScript developer and senior full-stack developer. Owner of getButterfly.com.
If you like this article, go ahead and follow me on Twitter or buy me a coffee to support my work!