How do i get the seperate read more and read less buttons to work?

Question

I have several boxes on the page and inside is a read more (läs mer..) button and read less ( läs mindre) when you click it again.
the problem is, now when i added the box around them whenever i click any readmore (läs mer..) it only extends the readmore of the last/bottom box.

pls help i have done everything i can think of

link to the code:
https://code.sololearn.com/WC2fpewYCu2u

Answer 1

Maria Milner
it's happening because you are overwriting your myFunction( ) defination, give each of your myFunction( ) a different name, see the code bit below👇👇 see myFunction( ) at line 173 and 177, and so on

https://code.sololearn.com/Wpc68nHf3UZz/?ref=app

Tip: instead of using onclick, use addEventListener ( ) and pass the id of the pressed button and read more and read less to the myFunction(), this way there is no need to create so many myFunction( ). Just one myFunction will work for everyone👍

Answer 2

Thankyou so much! I had tried defining the function before but I put the number inside of the brackets instead of before like you just did! thankyou so much!!