Question

I have a form with labels styled as class=”input”

The labels are positioned inside the form fields, and they are designed to disappear when you type in the field. That is working fine. The problem is when I reset the form after it is submitted.

jQuery("#requestform").get(0).reset();

This statement will clear the fields, but I also need to remove the “visibility: hidden” attribute from the labels so the labels will reappear.

I tried this, but it didn’t work:

jQuery('.formlabel').removeAttr("visibility");

here’s some sample html from my page:

<label class="input">
    <span class="formlabel" style="color: rgb(153, 153, 153); visibility: hidden;">Email</span>
    <input type="text" id="email" name="email" title="email">
</label>

what’s wrong with my jQuery? what’s the correct way to remove all ‘visiblity’ attributes from all my class=”formlabel” tags?

Cheers!

Answer 1

visibility is not an attribute but a CSS property. You need to use .css('visibility', 'visible'):

$('.formlabel').css('visibility', 'visible');

In case you do not need the layout-preserving behaviour of visibility: hidden consider using display: none – then you can simply use .show() to make the element visible.