Custom Coding to list items - make items clickable to open more text

https://static1.squarespace.com/static/52a1e3e4e4b055489471b02a/t/546ddd01e4b0c6e0e95add4d/1416486146288/The+final+step+of+my+creative+process+%2F%2F+Elle+%26+Co. I am looking to add something similar to the image posted on to my wordpress website. What I need the script/code to do: 1. Have 7 circles (instead of 5) with the number inside like the image 2. Have a title for each circle similar to the image 3. Make the circles and titles clickable so that it will present more text if clicked 4. Make it so the circle is filled in and the text is bold when it is active or selected.