CODE html question?

Text overlay of slideshow is not working. How can I fix???
<!--slideshow-->
<div class="slideshow-container">
<img class="mySlides" src="web/images/2img1.jpg" alt="2img1.jpg">
<img class="mySlides" src="web/images/2img2.jpg" alt="2img2.jpg">
<img class="mySlides" src="web/images/2img3.jpg" alt="2img3.jpg">
<img class="mySlides" src="web/images/2img4.jpg" alt="2img4.jpg">
<img class="mySlides" src="web/images/2img5.jpg" alt="2img5.jpg">
<img class="mySlides" src="web/images/2img6.jpg" alt="2img6.jpg">
<p id="text_overlay">
Hello World!
</p>
</div>
<!--END slideshow-->


**BROKEN CODE VVV**
<!-- http://stackoverflow.com/questions/25196326/jquery-inserting-text-into-container-div-on-hover)))-->
<script>
$('.Slideshow-container .owl-item').hover(function(){
var quote = $(this).find('.mySlides').text();
quote = '<p class="sit-quote_inner">' + quote + '</p>';
$('.sit-header .text_overlay').html(quote);
},function(){
$('.sit-header .text_overlay').html('');
});
</script>