On this page on our site - http://woldstest.users70.interdns.co.uk/the-team, I want to be able to add read more text wrapper buttons like this site - https://willows.uk.net/the-team/specialist-team/anaesthesia/.
We are using the Uber template, K2 and the JCE editor. Ideally, I want to be able to show the name (e.g. Pete Dixon), the job title (e.g. Veterinary Surgeon – Director) and the first paragraph under that by default (I also want the picture for each staff member displayed by default) then have any additional paragraphs hidden unless you click the Read More button. I want this to be the same for all Staff members' biographies on the page.
I've tried following multiple guides online but they often break when I have more than 1 read more button and they never quite display the text how I want it in different paragraphs.
How do achieve what I'm trying to do? What HTML code and CSS code do I need? Will I need to use any JavaScript, I've got JS enabled for the text editor. Any help would be greatly appreciated. Thanks in advance.