title: How to expand or collapse a div by setting a button on it using PHP and JavaScript
body: <p>I' am using php and javascript for expanding or collapsing some divs [which must be collapsed bydeafult] by setting up a button[whose text should be expand bydefault] on a div when i click on that button the div gets expanded and text of that button should be automatically changes to "collapse" and again if i click that collapse button the div should be closed and text changes to bydefault as "expand" and bydefault all the divs should be closed heres the code given below i am using :</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  function change()
  {
  if(document.getElementById("myButton1").value=="expand")
  {
  document.getElementById("myButton1").value="collapse";
  
  $(document).ready(function(){
    $("#myButton1").click(function(){
    $("div.container").hide("slow");
    });
  }
  else
  {
  document.getElementById("myButton1").value="expand";
  
  $(document).ready(function(){
    $("#myButton1").click(function(){
    $("div.container").show("slow");
    });
  
   }
  }
  
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;?php
  for($i=0;$i&lt;=3;$i++)
  {
  echo"&lt;div style='position:relative;border:1px solid #A5BEBE;background-color: #E7EFEF;     width:100%; height:300px;'&gt; &lt;input onclick='change()' type='button' value='expand' id='myButton1'     style='position:relative;left:85%;top:4%;background-    color:#B20000;color:white;width:70px;height:20px;font-size:15px;' &gt;";
  
  echo "&lt;div class='container' style='border:1px solid #A5BEBE;background-color:     white;width:100%;height:92.5%;'&gt;
    some text here
  &lt;/div&gt;";
  echo "&lt;/div&gt;&lt;br&gt;&lt;br&gt;";
  }
  ?&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>i just a beginner in php so tried my best but dint get the desired result please help me out of this thanks in advance</p>
  
  <p><strong>here is some more info</strong></p>
  
  <p>its not working for my actual code which is:</p>
  
  <pre><code>    while($runrows = mysql_fetch_assoc($getquery))
      {
      $title = $runrows ['sometext'];
      $desc = $runrows ['sometext'];
      $url = $runrows ['sometext'];
  $a = $runrows ['sometext'];
  $b = $runrows ['sometext'];
  $c = $runrows ['sometext'];
  $d = $runrows ['sometext'];
  $e = $runrows ['sometext'];
  $f = $runrows ['sometext'];
  $g = $runrows ['sometext']; 
  
  
  echo "
  &lt;div style='position:relative;border:1px solid #A5BEBE;background-color: #E7EFEF;width:84%;'&gt;     &lt;input onclick='change()' type='button' value='expand' class='myButton'         style='position:relative;left:85%;top:4%;background-    color:#B20000;color:white;width:70px;height:30px;font-size:15px;' &gt;  &lt;b&gt;&lt;p style='padding-    bottom:2px;font-size:30px;'&gt;&lt;font color='red'&gt;".$title."&lt;/font&gt;&lt;/p&gt;&lt;/b&gt;&lt;p&gt;&lt;b&gt;sometext :&lt;/b&gt;$desc&lt;br&gt;
  &lt;b&gt; sometext:-&lt;/b&gt;&lt;a href='".$url."'&gt;$url&lt;/a&gt;&lt;br&gt;
  &lt;b&gt;sometext :&lt;/b&gt;$b&lt;br&gt;
  &lt;b&gt;sometext :&lt;/b&gt;$c&lt;br&gt;
  &lt;b&gt;sometext :&lt;/b&gt;$d&lt;br&gt;
  &lt;b&gt;sometext :&lt;/b&gt;$e&lt;br&gt;
  &lt;b&gt;sometext :&lt;/b&gt;$f&lt;br&gt;
  &lt;b&gt;sometext :&lt;/b&gt;$g&lt;/p&gt;";
  echo "&lt;div class='container' style='border:1px solid #A5BEBE;background-color: white;'&gt;";
   include ('botfunction.php'); 
  echo "&lt;/div&gt;";
  echo "&lt;/div&gt;&lt;br&gt;";
  
  }
  </code></pre>
  
  <p>@TheGr8_Nik your code is not working for this . this is the small part of actual code but its not working there</p>