jQuery
In JavaScript jQuery is a JavaScript script package meant to make common and repetitive tasks in JavaScript with HTML (hypertext markup language) short and understandable code. The first stable release of jQuery was released by John Resig on January 26, 2006, with several additional releases since then.
To use jQuery, you can download and place the single jQuery file locally on a personal server, or use a public CDN (content delivery network) from companies such as Google or Microsoft. To load jQuery place the below script line in your HTML code, similar to the example below, which is loading jQuery from a Google CDN. Using a public CDN is likely to increase page load speed, because the visitor may already have downloaded and cached the script file.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
Once the JavaScript is loaded, using the $ function, similar to the example below.
<script>
function toggleDiv(divId) {
$("#"+divId).toggle(800);
}
</script>
In the example above, the JavaScript is loading the toggle jQuery function to show and hide the below div. The 800 in the toggle gives an animation to the div as it is hidden or shown.
<p>
<a href="javascript:toggleDiv('myContent');" style="background-color: #ccc; padding: 5px 10px;">Toggle Button</a>
</p>
<div id="myContent" style="background-color: #F0F0F0; padding: 5px 10px; display: none;">This example text is to help demonstrate jQuery. Pressing the Toggle Button shows and hides this text.</div>
Finally, the above HTML code creates a Toggle Button and the div that hides and shows depending on the state of the toggle.