title: Show more with php loop and jquery
body: <p>I am looping a about forty strings using php.  I am currently using <code>substr()</code> to only display the first 170 characters.  I am using jQuery to hide the rest of the string and to create a link to show the rest.  This is the code I am looping:</p>
  
  <pre><code>echo "&lt;span&gt;" . $substring_1 . "&lt;/span&gt;&lt;span class='dotdot'&gt;...&lt;/span&gt;&lt;span class='readmore'&gt;" . $substring_2 . "&lt;/span&gt;&lt;a href='#' class='clickmore'&gt;Show more&lt;/a&gt;";
  </code></pre>
  
  <p>Here is the jQuery: </p>
  
  <pre><code>$(document).ready(function() {
      $(".readmore").hide();
      $(".clickmore").click(function() {
          $(".dotdot").hide();
          $(".readmore").show();
      });
  });
  </code></pre>
  
  <p>This code works, however, I would like this to only "show more" for the individual string.  Right now, because I am using the class selector, when I click "show more", it "shows more" for every instance in the loop. </p>
  
  <p>Is there a way to only "show more" for the instance of the loop I am clicking on?</p>