How to Increase, Decrease and Reset Font Size using jQuery Functions

In this code, we implement a code that helps to increase, decrease and reset font size of the text by clicking on buttons provided.

<html>
<head>
<style>
.divClass {
font-size: 16px;
padding: 10px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#linkIncrease').click(function () {
modifyFontSize('increase');
});
$('#linkDecrease').click(function () {
modifyFontSize('decrease');
});
$('#linkReset').click(function () {
modifyFontSize('reset');
})
function modifyFontSize(flag) {
var divElement = $('#divContent');
var currentFontSize = parseInt(divElement.css('font-size'));
if (flag == 'increase')
currentFontSize += 3;
else if (flag == 'decrease')
currentFontSize -= 3;
else
currentFontSize = 16;
divElement.css('font-size', currentFontSize);
}
});
</script>
</head>
<body style="font-family:Arial">
Font-Size:
<a id="linkIncrease" href="#"><b>+</b></a>
<a id="linkDecrease" href="#"><b>-</b></a>
<a id="linkReset" href="#"> <b>X</b></a>
<br />
<br />
<div id="divContent" class="divClass"> jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. jQuery is the most popular JavaScript library in use today. jQuery is free, open-source software licensed under the MIT License. jQuery's syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax applications. jQuery also provides capabilities for developers to create plug-ins on top of the JavaScript library. This enables developers to create abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets. The modular approach to the jQuery library allows the creation of powerful dynamic web pages and web applications. </div>
</body>
</html>

Paste the above code in Notepad and Save the file as .HTML and RUN.