Loop through a jQuery .post function multiple times - php

Question

So I am using the jsplayer HTML5 player on my wordpress site, as well as some custom script to load in the next post and replace the old content once the video is finished:
$(document).ready(function(){
$(".video-js").bind('ended', function(){
var sStr = "<?php echo get_permalink(get_adjacent_post(true,'',true)); ?>";
var adj_numb = "<?php
$adj = get_adjacent_post(true,'',true);
$numb = $adj->ID;
echo $numb
?>";
var cur_numb = "<?php echo $post->ID; ?>";
$.post(sStr, function(data) {
var content = $( data ).find( '#post-' + adj_numb);
$( "#post-" + cur_numb ).html( content );
var vid = VideoJS.setup( "vid" );
vid.play();
});
});
});
This works great, for exactly one video. It loads in the next video and plays it, but after the 2nd video plays it just stops. I figure this means I have to sort of "reset" all my variables and start again from the beginning of the script, and that it's not doing this because of $(document).ready(function(), as it's already all loaded at this point.
Is there a standard way to loop through this script again, and re-set all the variables after its run once?
Thanks!
EDIT: Rendered JS:
$(document).ready(function(){
$(".video-js").live('ended', function(){
var sStr = "http://www.theloniousfilms.com/zachmath/volkswagon/";
var adj_numb = "94";
var cur_numb = "96";
$.post(sStr, function(data) {
var content = $( data ).find( '#post-' + adj_numb);
$( "#post-" + cur_numb ).html( content );
var vid = VideoJS.setup( "vid" );
vid.play();
});
});
});
HTML:
<div class="post-96 post type-post status-publish format-standard hentry category-zachmath" id="post-96">
<h2 id="director">Zach Math</h2>
<h2 id="post_title">Orkin -
<span id="post_name">
"Hot Tub"
</span>
<span id="home">HOME</span>
<div class="entry">
<div class="video-js-box">
<!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody --><br />
<video id="vid" class="video-js" width="640" height="360" preload autoplay poster="http://www.theloniousfilms.com/wp-content/uploads/2011/03/poster.jpg"><br />
<source src="http://d29zgp48wvs9kv.cloudfront.net/orkin.m4v" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /><br />
<source src="http://d29zgp48wvs9kv.cloudfront.net/orkin.ogv" type='video/ogg; codecs="theora, vorbis"' /><br />
<!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. --><br />
<object class="vjs-flash-fallback" width="640" height="360" type="application/x-shockwave-flash"<br />
data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf"><param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" /><param name="allowfullscreen" value="true" /><param name="flashvars" value='config={"playlist":["http://www.theloniousfilms.com/wp-content/uploads/2011/03/poster.jpg", {"url": "http://d29zgp48wvs9kv.cloudfront.net/orkin.m4v","autoPlay":true,"autoBuffering":true}]}' /><!-- Image Fallback. Typically the same as the poster image. --><br />
</object><br />
</video>
</div>

Answer 1

Looks like the HTML is being rewritten by
$( "#post-" + cur_numb ).html( content );
Change
$(".video-js").bind('ended', function(){
to
$(".video-js").live('ended', function(){
that should take care of it.
Also, change
$( "#post-" + cur_numb ).html( content );
with
$( "#post-" + cur_numb ).replaceWith( content );

Answer 2

i ended up just pulling all the post urls into an array, then iterated through each of them, moving to the next item in an array once the previous video finished playback.