JSFiddle - React, Tailwind, and code Playground

by shatul patil

HTML

<a href="#" class="btn btn-default meat" data-img="http://i.imgur.com/R3WLi9s.jpg">Beef</a>
<a href="#" class="btn btn-default meat" data-img="http://i.imgur.com/ssoKgPY.gif">Pork</a>

<div id="meatModal" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog">
	<div class="modal-content">
	  <div class="modal-body">
        <img src="" id="meatModalImg" width="100%">
	  </div>
	</div>
</div>
</div>

JavaScript

$(document).ready(function () {
    $('.meat').click(function(){
    $('#meatModalImg').attr('src', $(this).data('img'));
	$('#meatModal').modal({show:true})
});
});