JSFiddle - React, Tailwind, and code Playground

by Juan Muñoz

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>

<input type="button" value=clickaki id=asd>

CSS

.fa-thumbs-up{
  color:green;
}

.fa-thumbs-down{
  color:red;
}

JavaScript

$(document).ready(function (){
	$('#asd').click(function (){
  	alertame()
  })
})

function alertame(){

	$.alert({
    title: false,
    content: `<p>Please press <strong style="font-size: 20px;">Y</strong> to proceed</p>
    				<ul>
    						<li> Poner Centro de Costo <span><i class='fa fa-thumbs-up'></i></span></li> 
                <li> Poner Centro de Costo <span><i class='fa fa-thumbs-down'></i></span></li> 
                <li> Poner Centro de Costo </li> 
                <li> Poner Centro de Costo </li> 
					 </ul>`,
    buttons: {
        yes: {
            isHidden: true, // hide the button
            keys: ['y'],
            action: function () {
                //$.alert('Critical action <strong>was performed</strong>.');
            }
        },
        no: {
            keys: ['N'],
            action: function () {
                //$.alert('You clicked No.');
            }
        },
    }
});
}