jQuery - modify style (CSS) on the fly

 Watch this example on YouTube

 

1. CSS

 

.red{
    color: red;
    font-size:40px;
}

 

2. View

@model WebApplication1.Models.OrderCustomClass

@using (Html.BeginForm("Index", "Home"))
{
    @Html.Label("some text", new { @class="red" , @id ="lbl"})

}

<input type="submit" id="btn2" value="Modify CSS using jQuery" onclick="ModifyCSS()" />

@section Scripts{
<script type="text/javascript">
    function ModifyCSS() {
        var $test = $("#lbl").closest(".red");
        $test.css('font-size', '10px');
    }
</script>
}