Dotdotdot.js after and callback features - can't hide a link

Dotdotdot.js after and callback features - can't hide a link

Greetings,

I'm trying to use dotdotdot.js to ellipsis-truncate text in divs and other containers.  Using dotdotdot I can specify a container I want to receive ellipsis-truncation:
  2.   $(document).ready(function() {
  3.       $(".truncated_box").dotdotdot({
  4.           after: "a.readMoreLink",
  5.           callback: hideLinkIfNoTruncation
  6.       });
  7.   });
dotdotdot will truncate text inside containers with class truncated_box, and add an ellipsis and a link with the class readMoreLink.  However, a.readMoreLink must initially be inside the container, like this:
  2.   <div class="truncated_box">
  3.     This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div.
  4.      <a href="#" class="readMoreLink" onclick="clicked()">Read More</a>
  5.   </div>
The given callback is called whenever a container with the given class is considered for truncation (regardless of whether truncation occurs or not).  So I wrote this callback so ensure that if a container is considered for truncation but not truncated the 'read more' link will be hidden:
  2.     function hideLinkIfNoTruncation(isTruncated, origContent) {
  3.     if (!isTruncated) {
  4.     var shouldBeAnAnchor = origContent.filter('a')
  5.     shouldBeAnAnchor.hide()
  6.     }
  7.     }
The hide call has no effect.  If I debug I see that origContent.filter('a') does return the <a> object.  What is wrong with my code?  Bottom line is,  I only want the 'read more' link to show if truncation actually happens!

If anyone can help, thanks.  I've attached a zipfile with my HTML plus jquery and dotdotdot.js.  Also, here is all the code from my HTML page:
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <meta charset="utf-8">
  6. <title>Dot Dot Dot - Does it Work?</title>
  7. <script src="js/jquery-1.8.3.js" type="text/javascript"></script>
  8. <script src="js/jquery.dotdotdot-1.5.2.js" type="text/javascript"></script>
  9. <script type="text/javascript">

  11.     function hideLinkIfNoTruncation(isTruncated, origContent) {
  12.     if (!isTruncated) {
  13.     var shouldBeAnAnchor = origContent.filter('a')
  14.     shouldBeAnAnchor.hide()
  15.     }
  16.     }

  18.   $(document).ready(function() {
  19.       $(".truncated_box").dotdotdot({
  20.           after: "a.readMoreLink",
  21.           callback: hideLinkIfNoTruncation
  22.       });
  23.   });

  25. function clicked() {
  26. alert("Link was clicked.");
  27. }

  29. </script>

  31.   <style>
  32.   div.truncated_box {
  33.     height: 135px;
  34.     width: 350px;
  35.     font-size: 18px;
  36.     margin: 5px;
  37.     padding: 3px;
  38.     border-style: solid;
  39.     border-width: 3px;
  40.     border-color: red;
  41. }
  42. </style>
  43. </head>
  44. <body>
  45. <h1>Three Dots</h1>
  46.   <h3>Ellipses and Read More Link</h3>

  48.   <div class="truncated_box">
  49.     This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div.
  50.     This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div.
  51.     This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div.
  52.     <a href="#" class="readMoreLink" onclick="clicked()">Read More</a>
  53.   </div>

  55.   <div class="truncated_box">
  56.     This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div.
  57.      <a href="#" class="readMoreLink" onclick="clicked()">Read More</a>
  58.   </div>

  60.   <div class="truncated_box">
  61.     This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div. This is a rather lengthy text inside a div.
  62.      <a href="#" class="readMoreLink" onclick="clicked()">Read More</a>
  63.   </div>
  64. </body>
  65. </html>