JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://twitter.github.com/bootstrap/1.4.0/bootstrap-modal.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.css">
<div class="container">
<div class="delete_dosar">delete</div>
</div>

<!-- Boostrap modal dialog -->
<div id="delete_confirmation" class="modal hide fade" style="display: none; ">
    <div class="modal-header">
            <a href="#" class="close" data-dismiss="modal">x</a>
      <h3>Are you sure?</h3>
    </div>
    <div class="modal-body">
        <div class="paddingT15 paddingB15" id="modal_text">    
         Are you sure with this?
        </div>

    </div>
    <div class="modal-footer">
        <a href="#" class="btn confirm_delete_the_item no_return">yes</a>
      <a href="#" class="btn btn-secondary " data-dismiss="modal">no</a>
      
    </div>
  </div>

JavaScript

$(function() {

            
/** SETERGERE DE DOSAR DIN PARTEA STANGA **/
$(".delete_dosar").live('click',function(){
    
    $('#delete_confirmation').modal("show");
    $('.confirm_delete_the_item').live('click',function(e){
        $('#delete_confirmation').modal("hide");
        //e.preventDefault();
        alert('x');
    
        
    });
    
    return false;
    
});
         });