use jquery to remove element from parent

i have a form with multiple div elements like this

<div>
<label for="id">text</label>
<input type="text" name="id" id="id" value="">
</div>
<div>
<label for="id1">text</label>
<input type="text" name="id1" id="id1" value="">
</div>
开发者_开发百科

i use .post to validate some fields before submit if the input failed validation i add a span element to the parent div

$('#id').parent('div:first').append('<span class="error">error message</span>');
<div>
<label for="id">text</label>
<input type="text" name="id" id="id" value="">
    <span class="error">error message</span>
</div>

else i want to remove the span from the div and i tried

$('#id').parent('div:first').remove('.error');
$('#id').parent('div:first').remove('span');

but doesn't work any ideas ?

You could do:

 $('#id').nextAll('span.error').remove();

This would remove all the with class error following the input

fiddle here: http://jsfiddle.net/H5sDC/