Javascript-форум - Блок не убирается по клику в ie8 средствами Jquery

Доброго времени суток.
есть библиотека jquery

а так же скрипт

$('.join').click(function(){
    if (status==0){
    //request data for centering
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    var popupHeight = $(".pop").height();
    var popupWidth = $(".pop").width();
    $(".back").css({"opacity": "0","height": windowHeight});
    $(".back").fadeIn("slow");
        $('.pop').fadeIn('slow');
        $('.pop').css({
            'bottom': -170,
            'left': 0
            });
            status=1;
        }
             
    });

    $('.back').click(function(){
        if (status==1) {
            $(".back").fadeOut("slow");
            $(".pop").fadeOut("slow");
            status=0;
            }
        });
    $('.close_button').click(function(){
        if (status==1){
            $(".back").fadeOut("slow");
            $(".pop").fadeOut("slow");
            status=0;
        }
        });

ну и html

<div class="top_navi join">Вход</div>
<div class="pop">
	<input class="l_p" name="search" value="Логин" onblur="if(this.value=='') this.value='Логин';" onfocus="if(this.value=='Логин') this.value='';" type="text">
	<input class="l_p" name="search" value="Пароль" onblur="if(this.value=='') this.value='Пароль';" onfocus="if(this.value=='Пароль') this.value='';" type="text">
	<a href="javascript: alert('Страница в процессе разработки!');">Забыли пароль</a><br>
	<input id="remember" type="checkbox" name="first">
	<label for="remember">Запомнить меня</label>
	<button>Войти</button>
	<span class="close_button">Закрыть</span>
</div>
<div class="back"></div>

<div class="back"></div> имеет фиксированую высоту и ширину, и располагается на весь экран под блоком pop
Работает везде кроме ie8
по клику блок показывается, но при нажатии на любое место на сайте, а также на кнопку закрыть, не закрывается.
Помогите пожалуйста

<!DOCTYPE html> <html> <head> <script src='http://code.jquery.com/jquery-latest.js'></script>  <style type='text/css'> </style> <script type='text/javascript'> $(function (){ var status=1; $('.join').click(function(){ if (status==0){ //request data for centering var windowWidth = document.documentElement.clientWidth; var windowHeight = document.documentElement.clientHeight; var popupHeight = $(".pop").height(); var popupWidth = $(".pop").width(); $(".back").css({"opacity": "0","height": windowHeight}); $(".back").fadeIn("slow"); $('.pop').fadeIn('slow'); $('.pop').css({ 'bottom': -170, 'left': 0 }); status=1; } }); $('.back').click(function(){ if (status==1) { $(".back").fadeOut("slow"); $(".pop").fadeOut("slow"); status=0; } }); $('.close_button').click(function(){ if (status==1){ $(".back").fadeOut("slow"); $(".pop").fadeOut("slow"); status=0; } }); if (status==1){ $(".back").hide("slow"); $(".pop").hide("slow"); status=0; } }); </script> </head> <body> <div class="top_navi join">Вход</div> <div class="pop"> <input class="l_p" name="search" value="Логин" onblur="if(this.value=='') this.value='Логин';" onfocus="if(this.value=='Логин') this.value='';" type="text"> <input class="l_p" name="search" value="Пароль" onblur="if(this.value=='') this.value='Пароль';" onfocus="if(this.value=='Пароль') this.value='';" type="text"> <a href="javascript: alert('Страница в процессе разработки!');">Забыли пароль</a><br> <input id="remember" type="checkbox" name="first"> <label for="remember">Запомнить меня</label> <button>Войти</button> <span class="close_button">Закрыть</span> </div> <div class="back"></div> </body> </html>