Modal with return value using promises

index.html

<button id="show">Show</button>
<div id="popup">
    <button id="option1">Option 1</button>
    <button id="option2">Option 2</button>
    <button id="option3">Option 3</button>
    <button id="option4">Option 4</button>
    <button id="option5">Option 5</button>
</div>
<div id="result"></div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">

$('#popup').hide();
$('#show').click(function() {
    openPopup()
        .then(function(data) {
            $('#result').html("You pressed " + data)
            closePopup();
        })
})

function openPopup() {
    return new Promise(function(resolve, reject) {
        $('#popup').show();
        $('#option1').click(function() {
            resolve('option 1')
        })
        $('#option2').click(function() {
            resolve('option 2')
        })
        $('#option3').click(function() {
            resolve('option 3')
        })
        $('#option4').click(function() {
            resolve('option 4')
        })
        $('#option5').click(function() {
            resolve('option 5')
        })
    });
}

function closePopup() {
	$('#popup').hide();
}
</script>