jQuery UI Accordion : Creating a Basic Accordion

EDITABLE CODE:
<!DOCTYPE html> 
<html> 
	<head>
    <title>jQuery UI Accordion : Creating an Accordion</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.3/themes/hot-sneaks/jquery-ui.css" />
	<script src="http://code.jquery.com/jquery-2.1.3.js"></script>
	<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
       <script>
        $(document).ready(function() {
         $("#demoAccordion").accordion();
        });
    </script>

</head> 
<body>
<div id="demoAccordion">
	  <h2><a href="#">Asia</a></h2>
    <div>China, India , Japan, Singapore</div>

	  <h2><a href="#">Europe</a></h2>
	  <div>England, Germany, France, Spain, Italy</div>

	  <h2><a href="#">America</a></h2>
	  <div>Canada, USA, Mexico, Brazil, Argentina</div>
  </div>

</body>
</html>

LiveDemo: jQuery UI Accordion : Creating a Basic Accordion

<--Tutorialspark.com

Note: Each Heading with the selected div element gets transformed to an accordion.