Adding a button to a list element which displays the remaining elements when clicked | XM Community
Solved

Adding a button to a list element which displays the remaining elements when clicked

  • 22 July 2020
  • 1 reply
  • 7 views

Badge

I have a list with 5 list items. The second list item has a button after the text. When the button is clicked, the remaining list items should be displayed. But currently, the remaining items are displayed as a sub list, which is not what I am aiming for. I want the remaining items to be the part of the main list. This is how the list looks currently:
paVDZ.pngAlso in addition I want another paragraph of text to be shown below the list when the button is clicked, but the paragraph should be aligned with the "My list" text and not the bullet points.

icon

Best answer by rondev 23 July 2020, 00:24

View original

1 reply

Userlevel 7
Badge +22

You need to assign all the items to same ul tag and give a class name attribute to elements 3,4,5. Also close the ul tag and add div tag with same class name as of those three elements. Hide the elements using the class selector on ready event.
Now, on the click event of the button, just show the hidden things using the class selector.

Leave a Reply