title: Show/hide div using trigger with specific class to toggle div with same class
body: <p>I have my <code>triggers</code> and <code>divs</code> to show/hide in a while loop, instead of using  <code>div id</code> which has to unique, i've decided to use <code>div class</code> to show/hide a group of content among others.</p>
  
  <p><strong>what i'm trying to achieve:</strong></p>
  
  <p>i'm not at all good with javascript, and i've been trying to achieve this for days. Say i have a trigger with <code>div class="view1-'.$id1.'"</code> where <code>$id1=2</code> and <code>div class="licom-'.$cc_id.'"</code> where <code>$cc_id=2</code>  to show/hide, is it possible to ensure that my trigger would only show/hide the <code>div class</code> with the same id as <code>2</code>?.</p>
  
  <p><strong>JavaScript</strong></p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script language="JavaScript"&gt;
  $(document).ready(function(){
  var showText='View all replies';
  var hideText='Hide';
  // initialise the visibility check
  var is_visible = false;
  // append show/hide links 
  $('.view1').prev().append();
  $(".licom").hide(); 
  $(".view1").click(function(){//i need to pass the div class with the variable
  // switch visibility
  is_visible = !is_visible;
  // change the link depending on whether the element is shown or hidden
  $(this).html( (!is_visible) ? showText : hideText);
   //i also need to pass the right div class with the right variable, and keep the others hidden
  $('.licom').toggle(function() {
  $(this).closest('view1').find('.licom').hide();
  return false;
   },
  function() {
  $(this).closest("view1").next(".licom").show();
  return false;
   });  
      });          
  }); 
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>info.php</strong></p>
  
  <pre><code>  &lt;?php
    ...........
     $stmt = $conn-&gt;prepare(
    "SELECT *
    FROM comment
    WHERE post_id = :pid
    ");
  
  $stmt-&gt;bindParam(":pid", $type_id, PDO::PARAM_INT);
  
  
  $stmt-&gt;execute();
  
  while($obj = $stmt-&gt;fetch()){
       $username = $obj['user_name'];
        $comment = $obj['comment'];
        $id1 = $obj['id'];
        $userimage = $obj['user_image'];
  
    echo '&lt;div class="txt"&gt;';
    echo '&lt;div class="comment-container"&gt;';
    echo '&lt;div class="comment-item"&gt;';
      echo '&lt;div class="comment-avatar"&gt;';
        echo '&lt;img src="user/user_images/'.$userimage.'" alt="avatar"&gt;';
      echo '&lt;/div&gt;';
       echo '&lt;div class="comment-post"&gt;';
        echo '&lt;span style="font-weight:bold;"&gt;'.$username.'&amp;nbsp&amp;nbspsaid....  
       &lt;/span&gt;';
        echo '&lt;p style="margin-left:-11px;"&gt;'.$comment.'&lt;/p&gt;';
        echo '&lt;input type="hidden" name="comment_id" value="'.$id.'"&gt;';
  
         //trigger to hide/show replies
               echo '&lt;span class="view1-'.$id1.'" style="float:right;margin-top:-15px;"&gt;View all replies&lt;/span&gt;';
               //
  
            echo '&lt;/div&gt;';
  
           echo '&lt;/div&gt;';
  
            echo '&lt;/div&gt;';  
  
           echo '&lt;/div&gt;'; 
          echo '&lt;/div&gt;';
  
   //Relpy to comment, show only the first row
   $rep = $conn-&gt;prepare("SELECT  * FROM reply WHERE comment_id = :comid LIMIT 1");
  $rep-&gt;bindParam(":pid", $id1, PDO::PARAM_INT);
  
  
  $rep-&gt;execute();
  
  while($obj = $rep-&gt;fetch()){
      //...........same output as first without the view all replies trigger......
  
  //Relpy to comment, show from row 2-
  $rep = $conn-&gt;prepare("SELECT  * FROM reply WHERE comment_id = :comid LIMIT 1,18446744073709551615");
  $rep-&gt;bindParam(":pid", $id1, PDO::PARAM_INT);
  
  
  $rep-&gt;execute();
  
  while($obj = $rep-&gt;fetch()){
  
  $cc_id = $obj['comment_id'];
  //div to show/hide
  echo '&lt;div class="licom-'.$cc_id.'"&gt;';
   //...........same output as first without the view all replies trigger......
  
  }
    }
       }
   ?&gt;
  </code></pre>
  
  <p>how do i re-write my JavaScript so that all div of class <code>"licom"</code> are hidden by default, and only the div with the same id as the trigger say <code>2,3,...</code> as the case maybe would show/hide onClick. </p>