How to show a hidden class for an element with javascript?

Question

Hi there, I'm having trouble trying to show a hidden class that has already been applied to an element. I'm trying to use the show() method with the class and selected element, to no avail. Any help would be appreciated!

HTML

<label for="name" class="overlay required"><span>Name...</span></label>
<input class="input-text" type="text" id="name" />

CSS

label.required:after {
 content: "Required";
 float: right;
 color: #07305e;
 display: none;
}

Javascript

jQuery("form input").each(function(){
    var input = jQuery(this);
    if (input.val() == 0){
        input.prev().effect("pulsate", { times:1 }, options.pulseSpeed).focus();
        jQuery(".required", input.prev()).show(); //Show hidden class .required
    }

Answer 1

So you want to change the display of every element that has the "required" class applied to it? In order to do that you need to select and loop over each element. My syntax is a little rough, but I think it might look something like this:

$(".required").each(function(){
   var input = $(this);
   input.css("display", "block");
}

Otherwise, you may want to look into LESS which lets you use variables in CSS. I'm not positive if that will work for you needs though.

Answer 2

jQuery("form input").each(function(){
    var input = jQuery(this);
    if (input.val().length == 0){
        var input = input.prev().effect("pulsate", { times:1 }, options.pulseSpeed).focus();
$('input[for="'+input.attr('id')+'"]').show(); //Show hidden class .required
    }

Answer 3

I believe you're looking for addClass() and removeClass()