JSFiddle - React, Tailwind, and code Playground
HTML
<a href="/user/login/" class="test">comment #1</a><br>
<a href="/user/signup/" class="test">comment #2</a><br>
<a href="/user/reset_password/" class="test">comment #3</a><br>
<div id="somediv" title="this is a dialog" style="display:none;">
</div>
JavaScript
function handler() {
if (this.readyState == this.DONE) {
if (this.status == 200 && this.responseText != null) {
$("#somediv").text(this.responseText);
return;
}
console.log('Something went wrong! Status = ' + this.status);
}
}
var client = new XMLHttpRequest();
client.onreadystatechange = handler;
$(document).ready(function () {
$(".test").click(function () {
$("#somediv").html('Loading ' + $(this).attr("href"));
client.open("GET", $(this).attr("href"));
client.send();
$("#somediv").dialog({
width: 400,
height: 450,
modal: true,
close: function () {
$("#somediv").html('');
}
});
return false;
});
});