JSFiddle - React, Tailwind, and code Playground

by Leon

HTML

<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<div style="margin-left:auto;margin-right:auto;text-align:center">
	<br><br>
	<h2>Are you a magician?<br>Can you make the cat appear and disappear?</h2>
	<br>
	<button type="button" style="font-size:x-large">Show me cat!</button>
	<br>
	<img src="https://pbs.twimg.com/profile_images/616542814319415296/McCTpH_E.jpg">
</div>

JavaScript

$( "img" ).toggle(); // hide on img on init

// disable right click context menu
$('*').contextmenu( function() {
    return false;
});

$('button').mousedown(function(event) {
    switch (event.which) {
        case 1:
            break;
        case 2:
            break;
        case 3:
			// show cat
            $( "img" ).toggle();
			// change text of button
			if ($(this).text() == "Show me cat!") 
			{ 
				$(this).text("Make cat disappear!"); 
			} 
			else 
			{ 
				$(this).text("Show me cat!"); 
			}; 

            break;
        default:
            alert('You have a strange Mouse!');
    }
});