jQuery addClass example

Change class name on click in jQuery

by ChrisStanyon

HTML

<form id="video-form">
    <input type="text" name="firstName">
    <input type="submit" name="submitVideo" id="submitVideo" value="Submit">
</form>

<p>The result will appear here in a couple of seconds</p>

<div id="video-alert"></div>

CSS

body { color: white; background-color: #20262E; }
#video-alert { border: 1px solid green; padding: 10px; margin: 10px 0; }

JavaScript

$("#video-form").submit(function(e) {     
    e.preventDefault();
            
    $.ajax({
        type: "post",
        url: "/echo/html",
        data: { html : '<h1>Result :)</h1', delay : 2 },
        beforeSend: function (){
            $("#submitVideo").val("Please wait...").prop("disabled", true);
        }
    })
    .done(function(response) {
        $('#video-alert').html(response);
    })
	.always(function() {
        $("#submitVideo").val("Submit").prop("disabled", false);
    });
});