strange problem

strange problem

this is a rather strange problem and i dont know how to solve.

I have a form which i am displaying in a lightbox called "prettyphoto". Now the form is placed inside a div which has property of display:none

so this is how the light box opens when the page loads
<script type="text/javascript" charset="utf-8">
      $(document).ready(function(){

         $(".gallery a[rel^='prettyPhoto']").prettyPhoto({theme:'facebook'});

// my validation code   
   $("#txt_firstname").blur(function()
    {
      alert('hello'); // just testing
        var username_length;

        username_length = $("#txt_firstname").val().length;
        $("#firstname_warning").empty();

        if (username_length < 2)
            $("#firstname_warning").append("First Name is required");
    });


});
      </script>


The validation code never works.. because .. the field "txt_firstname" is placed inside a div whose property is display:none;

Is there anyother way i can access it ?

I hope i made myself clear. Please let me know if you need to know more to help me.
thanks