How to hide and show Modal Popup in javascrip

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <script>
     function ShowPopup() {

         $("#DivPopup").show();
         //or
         $("#DivPopup").fadeIn();

     }

     function HidePopup() {

         $("#DivPopup").hide();
         //or
         $("#DivPopup").fadeOut();

     }
 </script>

#DivPopup
     {
         position: fixed;
         top: 50%;
         left: 50%;
         height: 240px;
         width: 240px;
         margin-left:-120px;
         margin-top:-120px;
         background-color:Red;
         border:1px solid black;
         border-radius:10px;
        display:none;
     }

<div id="DivPopup">
</div>
<span  önclick="ShowPopup()">Show</span> <span  önclick="HidePopup()">Hide</span>