Backstretch.js with WordPress Featured Image from Page ID

Question

I am working on a single page website where every section has its content loaded in through a post id.

<?php $id=193; $post = get_page($id); echo $post->post_content; ?>

Every page has its own full background image thats placed under the content div, I use Backstretch.js to create that image in a div id.

Example.
http://jsfiddle.net/4k6ty4n1/4/

Till here everything works perfect but I would like to make it possible that the background images can be editted with the Featured Image-option in WordPress instead of being hardcoded as it is right now but can't find a solution.

It should be something like this (i guess):

$(function() {
$("#pageOneImage").backstretch("<?php $id=193; $post = get_post_thumbnail_id($id); echo $post->get_post_thumbnail_id; ?>");
$("#pageTwoImage").backstretch("<?php $id=195; $post = get_post_thumbnail_id($id); echo $post->get_post_thumbnail_id; ?>");
});

Answer 1

It was actually pretty simple:

<?php $thumb_id = 1; $url = wp_get_attachment_url( get_post_thumbnail_id($thumb_id) ); ?>

<script>
$("#divname").backstretch("<?php echo $url ?>");
</script>

Answer 2

For me, this code works just fine:

<script>
jQuery(document).ready(function($) {
     jQuery(".your-class-or-ID").backstretch("
 <?php
    $thumb_id = get_post_thumbnail_id();
    $thumb_url = wp_get_attachment_image_src($thumb_id,'full', true);                
    echo $thumb_url[0];
?>");
});
</script>