Why is my 'read more' button creating duplicate text on category pages?

[Niccolò8]

Hey folks,

here we are again!!

I've insert this code to create "read more" and "read less" button on all my category pages but, I don't know why my text become duplicate.

Please can you check my code and let me know where I wrong?

Thank you so much!!

{% assign collection_strip = collection.description | strip %}
{% if collection_strip != "" %}
{% assign paragraphs = collection.description | newline_to_br | split: '<br />'%}
<p>{{paragraphs}}</p>
<span id="more" style="display: none;">
  {% assign len = paragraphs | size %} {{paragraphs | slice: 2, len}}
</span>
<div style="text-align: center">
  <u><button class="btn  secondary-button" onclick="readMore()" id="myBtn">Read more...</a></button></u>
</div>
<script>
  function readMore() {
    var moreText = document.getElementById("more");
    var btnText = document.getElementById("myBtn");
    if (more.style.display !== "none") {
      btnText.innerHTML = "Read more...";
      moreText.style.display = "none";
    } else {
      btnText.innerHTML = "...Read less";
      moreText.style.display = "inline";
    }
  }
</script>
{% endif %}

[cringe_studio]

Hi @Niccolò8 ,
your code seems to be fine.

Could you please provide Shopify store URL in order to reproduce the issue?

Thanks,
Simone

[Niccolò8]

Hi @cringe_studio ,

thank you so much for your reply.

I've fix the issu! 

Thank you so much again!