jquery - Javascript variable is not working -

i'm trying add background image slider in wordpress theme. need add javascript variable slider function correct url images. variable not working printing without printing value.

here jquery code , variable name 'turl'

<script type="text/javascript">     var turl = '<?= get_bloginfo("template_url"); ?>'; </script> 

$(function() {     $.vegas( 'slideshow', {         delay: 8000,         backgrounds: [             { src: turl+'bgslider/images/1.jpg', fade: 4000 },             { src: turl+'bgslider/images/2.jpg', fade: 4000 }         ]     });    }); 

here how print in page source file ()

$(function() {     $.vegas( 'slideshow', {         delay: 8000,         backgrounds: [             { src: turl+'bgslider/images/1.jpg', fade: 4000 },             { src: turl+'bgslider/images/2.jpg', fade: 4000 }         ]     });   }); 

so:

<script>  (function ($) {      $(function(){      var turl = '<?php echo get_template_directory_uri(); ?>';     $.vegas( 'slideshow', {         delay: 8000,         backgrounds: [             { src: turl+'/bgslider/images/1.jpg', fade: 4000 },             { src: turl+'/bgslider/images/2.jpg', fade: 4000 }         ]     });      }); }(jquery)); </script>