show hide content

show hide content

hi i want to show hide the contents on button click pls guide me i am new to jquery mobile

  2. <!DOCTYPE html >

  4. <html>
  5.     <head>
  6.         <title></title>
  7.         <script src="cordova.js"></script>
  8.         
  9.         
  10.          <script src="cordova.js"></script>
  11.         <script src="jquery.min.js"></script>
  12.         <script src="jquery/jquery.mobile.js"></script>
  13.         <link href="jquery/jquery.mobile.css" rel="stylesheet" />
  14.     </head>
  15.     <body>
  16.         
  17.        <div data-role="page" >
  18.         
  19.            <div data-role="header" data-position="fixed">
  20.                 <a data-rel="back">Back</a>
  21.                 <h1>Search</h1>
  22.                 <a href="index.html">Settings</a>
  23.             </div><!-- /header -->

  25.            <div data-role="content" id="tree">

  27.                 <div data-role="content"> 
  28.                     <ul id="search_list" data-role="listview" data-filter="true">
  29.                     </ul>                 
  30.                 </div>
  31.     
  32.             </div>
  33.         
  34.            <div data-role="content" id="search">

  36.                 <div data-role="content"> 
  37.                     <ul id="search_list" data-role="listview" data-filter="true">
  38.                     </ul>                 
  39.                 </div>
  40.     
  41.             </div>
  42.            
  43.            <div data-role="content" id="settings">

  45.                 <div data-role="content"> 
  46.                     <ul id="search_list" data-role="listview" data-filter="true">
  47.                     </ul>                 
  48.                 </div>
  49.     
  50.             </div>
  51.            

  53.             <div data-role="footer" data-position="fixed">
  54.                 <div data-role="navbar">
  55.                     <ul>
  56.                         <li><a href="#tree" data-icon="grid">Dash</a></li>                        
  57.                         <li><a href="#search" data-icon="search" class="ui-btn-active">Search</a></li>
  58.                         <li><a href="#settings" data-icon="home">Settings</a></li>
  59.                     </ul>    
  60.                 </div>
  61.             </div>
  62.         
  63.         </div>
  64.          <script>           
  65.              
  66.               
  67.           </script>  
  68.         
  69.     </body>
  70. </html>