JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//yandex.st/jquery/fancybox/1.3.4/jquery.fancybox.css">
<script src="//yandex.st/jquery/fancybox/1.3.4/jquery.fancybox.min.js"></script>

JavaScript

var response = 2;
jQuery(document).ready(function () {
    // inside ajax success
    var _textResponse, _color;
    switch (response) {
        case 1:
            _textResponse = "<div id=\"green\"><h1>Green response</h1></div>",
            _color = "green";
            break;
        case 2:
            _textResponse = "<div id=\"red\"><h1>Red response</h1></div>",
            _color = "red";
            break;
        default:
            break;
    };
    $.fancybox(_textResponse, {
        padding: 30, // instead of border-width
        onStart: function () {
            $("#fancybox-content").css({
                backgroundColor: _color,
                borderColor: _color,
                boderStyle: "solid"
            });
        }
    });
}); //ready