JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/jquery-ui-git.css">
<div class="grid">
    <ul>
        <li data-id="1" data-name="João da Silva" data-age="25"><a href="#">João</a></li>
        <li data-id="2" data-name="Felipe Nogueira" data-age="30"><a href="#">Felipe</a></li>
    </ul>
</div>

<div class="dialog"></div>

JavaScript

var $item = $('.grid ul li'),
    $dialog = $('.dialog');

$dialog.dialog({
    autoOpen: false,
    modal: true
});

$item.on('click', function() {
    var $id = $(this).data('id'),
        $name = $(this).data('name'),
        $age = $(this).data('age');
    
    $dialog.html('Este é o ' + $name + '. Ele tem ' + $age + ' anos e é o ' + $id + 'º usuário registrado.');
    $dialog.dialog('open');
});