Easy All

As I've been learning jQuery lately, I decided to write my own modal window to play videos in, when the video thumbnail is clicked. It all works fine, but I need some help turning it into a plugin, so I can use it on different pages with different parameters. I read the documentation, and a few tutorials, and I've got it 99% working, just now my 'window close' function doesn't work.

1. <script type="text/javascript">
2. (function($){
3. $.fn.extend({
4.     mynewmodal: function(options) {
5.    var defaults = {
6.                    container: "#modalcontainer"
7.           };
8.         var options = $.extend(defaults, options);
9.         return this.each(function() {
10.             var o = options;
11.             // Add our click OPEN event
12.             $(this).click(function (e) {
13.                 e.preventDefault();
14.                 // Add our overlay div
15.                 $('body').append('<div id="overlay" />');
16.                 // Fade in overlay
17.                 $('#overlay').css({"display":"block","opacity":"0"}).animate({"opacity":"0.2"}, 300),
18.                 // Animate our modal window into view
19.                 $(o.container).css({"top":"43%", "opacity":"0"}).show().animate({"top": "50%", "opacity": "1"}, 550),
20.                 // Add our close image
21.                 $(o.container).append('<div id="modal-vid-close" title="Close window" />');
22.                 // Add our click CLOSE event
23.                 $('#overlay', '#modal-vid-close').click(function () {
24.                     //Animate our modal window out of view
25.                     $(o.container).animate({"top": "55%", "opacity": "0"}, 350).fadeOut(200),
26.                     // Fade out and remove our overlay
27.                     $('#overlay').fadeOut(200, function () { $(this).remove(); $('#modal-vid-close').remove()} )
28.                 });
29.             });
30.         });
31.     }
32. });
33. })(jQuery);
34. </script>

And then I fire it on my page using:

1. <script type="text/javascript">
2. var $j = jQuery.noConflict();
3. $j(document).ready( function() {
4. $j('a.video_container').mynewmodal({ container: "#video" });
5. });
6. </script>

I have an example up on jsbin if that'll help - http://jsbin.com/adere

I'm sure I'm just overlooking something simple, but for the life of me I can't figure out what it is. Any help much appreciated!