"Read more" button

[Marta]

Hi Armin!

In a page of my site I have a long text and I wish it was fully visible only when you click a "Read more" button.
I first tried a pair of plug-in (Wp show more, Collapse-O-Matic), but they didn't work because the inclusion of texts in Lay Theme is different from the classic mode of Wordpress themes.
So I tried to insert a button through the codes, and the only system that seems to work is this:
https://codepen.io/devkick/pen/soJpy

HTML and CSS parts work well, but I can't integrate the Js part. I paste the Js code in "Custom <head> content", in a script tag and put "JQuery" instead of "$", but it still does not work.

Original script:
$(".readmore").on('click touchstart', function(event) {
var txt = $(".more-content").is(':visible') ? 'Show more (+)' : 'Less (–)';
$(this).parent().prev(".more-content").toggleClass("visible");
$(this).html(txt);
event.preventDefault();
});

My version:
<script>
jQuery(".readmore").on('click touchstart', function(event) {
var txt = jQuery(".more-content").is(':visible') ? 'Show more (+)' : 'Less (–)';
jQuery(this).parent().prev(".more-content").toggleClass("visible");
jQuery(this).html(txt);
event.preventDefault();
});
</script>

My page: http://fabrizioinglese.com/bio-di-prova

Did I do something wrong?
Is there another way to insert the button?

I hope you give me a solution!
Thanks for the help and for the theme,

Marta

[arminunruh]

Hey Marta sorry for my late response. As written here http://laytheme.com/documentation.html#binding-click-events you need to bind clicks a bit differently.

<script>
jQuery(document).on("click touchstart", ".readmore", function(event) {
var txt = jQuery(".more-content").is(':visible') ? 'Show more (+)' : 'Less (–)';
jQuery(this).parent().prev(".more-content").toggleClass("visible");
jQuery(this).html(txt);
event.preventDefault();
});
</script>

[Marta]

Don't worry!

I didn't write the code correctly.
Thank you very much, now it works perfectly!

Merry Christmas Armin!

Marta

[arminunruh]

Merry Christmas to you too :)

[CesareCesariano]

@arminunruh Dear Armin,
Lay Theme is awesome.

Is there today a possibility for a "read more" button?
The Link is invalid, unfortunately.

Best regards

[arminunruh]

yo just use the new "accordion" feature:
https://www.instagram.com/p/ClBAFnUD-tG/

[CesareCesariano]

@arminunruh Best video ever! thx