Не получается спрятать div.
 

Доброе время суток. Я далеко не новичек в сайтостроении, но последние часа три пытаюсь спрятать div. Вот кусочек моего кода:

var $desc = $('div.desc');
$('li.description').click(function(){
$desc.addClass('active');
})
$('div.btn').click(function(){
$('div.desc').removeClass('active');
//document.getElementById("desc").className = document.getElementById("desc").className.replace(/\bactive\b/,'')
});

Наверняка все догадались, что в классе active в цсс у меня прописано display: block; Ну а теперь собствено в чем дело - по клику на li.description, div.desc благополучно появляется и ему добавляется класс active, а вот по клику на div.btn класс active нифига не убирается, ну и div.desc не прячется. Причем я пробовал не только классы добавлять. Например:

var $desc = $('div.desc');
$('li.description').click(function(){
$desc.css('display', 'block');
})
$('div.btn').click(function(){
$desc.css('display', 'none');
});

делает все почти также как и предыдущий пример, т. е. дописывает style="display: block", но по клику на div.btn не устанавливает none.
Когда я делаю че-то типа такого:

var $desc = $('div.desc');
$('li.description').click(function(){
$desc.css('display', 'block');
})
$('div.btn').click(function(){
$desc.css('width', 0); или $desc.css('z-index', -99);
});

то все нормально работает. Но если я поставлю $desc.css('width', 100); или $desc.css('z-index', 2); по нажатию на li.description оно опять перестает работать. Пробовал вместо $desc ставить $(document).find('.desc') и кучу еще разных методов - ничего не получается. Функции jquery show, hide тоже не работают как надо (работают соответственно addClass() и removeClass()). У div.desc выставлено position: absolute.

Если кто знает в чем причина подскажите пожалуста. Или может напишите какой-то алтернативный кусочек кода, который будет работать. Потому что даже вот этот не работает:

document.getElementById("desc").className = document.getElementById("desc").className.replace(/\bactive\b/,'')

Всем заранее спасибо!