JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div class="ah-modal-wrapper">
  <div class="ah-modal">
   <h5>
     when I select this text. and release my mouse click outside this modal. Modal closed. But I want to prevent this.Modal only closed when I clicked outside the modal. 
   </h5>
  </div>
</div>

CSS

.ah-modal-wrapper {
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  top: 0;
  left: 0;
  overflow: auto;
  z-index: 0;
}

.ah-modal {
  width: 40%;
  height: auto;
  background-color: white;
  margin: 15% auto;
  z-index: 1;
}

JavaScript

let istextSelected = false;
$(window).click(function(e){
	//alert('Jquery working well');
  let classname = e.target.className;
  if(classname == "ah-modal-wrapper") {
    if(istextSelected == false) {
    	e.target.style.display = 'none';
    }
    istextSelected = false;
  }
});

$(".ah-modal").on('mousedown',function(e){
istextSelected = true;
});