Help with passing variable to function?

Hi Guys,
i have some code to grab all the latest videos from a youtube user, and then display 1 video embedded, and the rest of the videos are thumbnails below the main video.

I would like to have it so when the thumbnails are clicked, it changed the main video to the one clicked.

Whenever is pass the variable it all falls apart ?

Can anyone advise me on how to do this?

Thanks

[code]<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js”></script>
<script type=”text/javascript”>$(function() {
$.getJSON(‘http://gdata.youtube.com/feeds/users/fanfairmusic/uploads?alt=json-in-script&callback=?&max-results=1’, function(data) {
$.each(data.feed.entry, function(i, item) {
var title = item[‘title’][‘$t’];
var video = item[‘id’][‘$t’];
video = video.replace(‘http://gdata.youtube.com/feeds/videos/’,’http://www.youtube.com/v/’);
$(‘#youtube’).append(‘<div class=”videoURL”><object width=”480″ height=”385″><param name=”movie” value=”‘+video+’&hl=en_GB&fs=1″></param><param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param><embed src=”‘+video+’&hl=en_GB&fs=1″ type=”application/x-shockwave-flash” allowscriptaccess=”always” allowfullscreen=”true” width=”480″ height=”385″></embed></object></div>’);
});
});
});
</script>

<script type=”text/javascript”>
$(function() {
$.getJSON(‘http://gdata.youtube.com/feeds/users/fanfairmusic/uploads?alt=json-in-script&callback=?&max-results=20’, function(data) {
$.each(data.feed.entry, function(i, item) {
var title = item[‘title’][‘$t’];
var image = item[‘id’][‘$t’];
var video = item[‘id’][‘$t’];
video = video.replace(‘http://gdata.youtube.com/feeds/videos/’,’http://www.youtube.com/v/’);
image = image.replace(‘http://gdata.youtube.com/feeds/videos/’,”);
$(‘#youtube2’).append(‘<img src=”http://i.ytimg.com/vi/’+image+’/0.jpg” width=”100″ height=”60″ />’);
});
});
});
</script>

<div id=”youtube”></div>
<div id=”youtube2″></div>[/code]

Also in #JavaScript _↴