JQuery Overlay (Dynamic Content)

HTML

<script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"></script>
<link rel="stylesheet" href="http://static.flowplayer.org/tools/css/standalone.css">
<div class='container'>
 <input type='text' id='variable1' value='abc' class="inp" />
 <div class='myoverlay hideme'>
   xxxxx
 </div>
</div>
<br>
<br>
<br>
<br>
<button type="button" class="but"> press </button>

CSS

.container {
  float:left;
  position:relative;
}

.myoverlay {
  position:absolute;
  top:0px;
  left:0px;
  color: '#ebecff';
  opacity: 0.9;
  width:100%;
  height:100%;
}

.hideme {
  display:none;
}

JavaScript

$('.but').click(function() {
   
    $(".myoverlay").toggleClass('hideme');
    
});