jQuery Forum

Hi, can anyone help. I can't figure out why this isnt working.... I have a div called #overlay that is currently hidden. It covers the whole page and has a form inside. I want to make it visible when a button on the page is clicked.

<div id="changingchange">
    <div id="overlay">
        <div id="form">

            <!-- form here -->

        </div>
    </div><!--overlay-->
    <div class="inner">
        <div class="page">


            <div class="button">Show form</div>


        </div>
    </div>
</div><!--changing-change-->

<script type="text/javascript">
$(function () {
        $('.button').click(function () {
           $(this).parent('#changingchange').find('#overlay').css('display', 'block');
    });
});
$(function () {
        $('p.close').click(function () {
           $(this).parent().find('#overlay').css('display', 'none');
    });
});
</script>

Any suggestions will be appreicated..

Kelly