JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/dot-luv/jquery-ui.css">
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<select id="M" name="Gender">
    <option value="M">Male</option>
        <option value="F">Female</option>
</select>

<div id="dv" class="dvsample">
    Hai
</div>

CSS

.dvsample{
display:none;
}

JavaScript

$("#M").change(function () { 
          if ($(this).val() == "F") { 
              $('#dv').dialog({
                width: 300, 
                height: 300,
                modal: true,
                resizable: true,
                open: function(type,data) {
                  $(this).parent().appendTo("form");},
                autoOpen: true,  
                title: 'Sample'
            });
           } 
 });