JSFiddle - React, Tailwind, and code Playground

by D Guillory

HTML

<div class="modal" id="modalOne">
    <div class="inner" id="divOne">
        <div class="inner2"> <span>Testing stopping propagation of click events</span>

            <div class="buttons" id="divTwo">
                <input type="button" id="btnContinue" value="Continue" onclick="hidemodal();" />
                <input type="button" id="btnLogout" value="Logout" onclick="hidemodal();" />
            </div>
        </div>
    </div>
</div>

CSS

.modal {
    position:fixed;
    z-index: 9999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #222;
}
.inner {
    width: 120px;
    height: 120px;
    font-size: 13px;
    box-shadow: 0 3px;
    8px;
    rgba(34, 25, 25, 0.4);
    background-color: #eee;
    position: static;
}

JavaScript

//Determining root cause of timer issue
$('#btnLogout').click(function () {
    //$('#sessiontimeout-warning').close();
    $('.modal, .inner').hide();
})

$('#btnContinue').click(function () {
    $('.modal, .inner').hide();
    //$('#sessiontimeout-warning').closede();
})
$(!'#btnLogout') || (!'#btnContinue').click(function (event) {
    event.stopPropagation();
})

function hidemodal (){
    $('#modal').dialog("close");
}