Validation

Validation using jquery

HTML

<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
Link : <a href="" id="lnk">nothing here yet</a> <br>
    <input type='text' id='userInput' placeholder='Enter username' />
    <input type='button' onclick='changeText()' value='Change Link'/>
<script>
function changeText(){
        var userInput = document.getElementById('userInput').value;
        var lnk = document.getElementById('lnk');
    lnk.href = "http://www.test.com/" + userInput;
        lnk.innerHTML = lnk.href;
    }
</script>

CSS

.error {
    font: normal 10px arial;
    padding: 3px;
    margin: 3px;
    background-color: #ffc;
    border: 1px solid #c00;
}
body {
    font-size:x-large;
    background:#CCC;
}
h1 {
    margin-bottom:20px;
}
form {
    padding:50px;
}