Fade in after acreate a span

i would like to create the span class error, and fade it

if(formName == '') {

        $("#name").after('<span class="error"> Put your name please</span>');
        $(".error").fadeIn("slow");
        hasError = true;
    }

Wh开发者_StackOverflowat is missing me here ?

Thanks

---

Your problem is that you create the span and it's already shown when you create it. Try hiding it and then fading it in:

$(".error").hide().fadeIn("slow");

This may not produce a desirable result if you have multiple elements with the class error, however. To fix that, try something like this:

var error=$('<span>').addClass('error').hide().text('Please type your name.');
$('#name').after(error);
error.fadeIn('slow');

---

$("#name").after('<span class="error" style="display:none;">Put your name please</span>');
$('.error').fadeIn('slow');
hasError = true;

You almost had it. All fadeIn does is set the display css value to finally show the DOM object, but if it is already shown then it won't do anything.

---

The problem is you're appending the attribute to the dom after the name element, then attempting to fade it in. The opacity of the ".error" elements is already set at 100%. So the fade does nothing. This jsfiddle may show you what I mean: http://jsfiddle.net/peFHN/