Jquery recursive selector

I have whole bunch of <div class="productlistname"><a href="#">The Text!</a></div>. What I want to do go through all .productlistname and truncate the text and replace the current text with the truncated version.

Here is what I hav开发者_如何学Goe so far:

$(".productlistname a").html($(".productlistname a").html().substring(0,10));

This just truncate the first one and replaces the rest of .productlistname with the truncated version of the first one.

$(".productlistname a").each(function () {
    $(this).html($(this).html().substring(0,10));
});

$(".productlistname a").each(function() {
  $(this).html($(this).html().substring(0,10));
});

$(".productlistname a").each(functon(){
  // loopy loop
});