jQuery.labelit demo

More information, documentation and download on the project's page : http://pioul.fr/jquery-labelit/

HTML

<script src="http://pioul.fr/ext/jquery_labelit/jquery.labelit.min.js"></script>
<div>
    <label for="firstname">Firstname</label>
    <input id="firstname" type="text"/>
</div>

<div id="here">
    <label class="labelit">Lastname<input type="text"/></label>
</div>

<div>
    <label for="description" class="labelit">Description</label>
    <textarea id="description"></textarea>
</div>

<div>
    <label>Other Description<textarea></textarea></label>
</div>

CSS

div {
    padding: 10px;
}

input, textarea {
    margin-left: 10px;
}

JavaScript

// only add a placeholder to inputs whose labels have class "labelit", and that are inside the div#here
// hideLabel being set to true, those inputs' labels are removed
$("div#here").labelit({
    labelClass: 'labelit',
    hideLabel: true
});