Javascript help showing list of hidden elements one by on in new list and increasing the DOM

Hello Hype amigos,

I need to get a list of hidden elements and show them in a new list, thereby increasing the size of the DOM and using the .scrollToBottom function. Operating similar to a SMS texting system.

Except instead of content arriving from 1 user to another it goes from a hidden list to a new list.

This is what I have so farChatBot ConnorLondon.hype.zip (19.2 KB) using a strategy of setting an entire class “bubble” to hidden and then running a function which:

  • 1st: cycles through the hidden class of bubbles and makes them visible incrementally with a counter.

  • 2nd . Then each element is moved up by resetting its property.

This almost works except when the bubbleBack function runs the order the bubble class can get messed up.

I also know a better way to programmatically achieve my goal is to use the .scrolltoBottom method with 2 lists. But haven’t been able to crack it.

If anyone can give me pointer a to get across the finish line that would be greatly appreciated.

Thanks!

Connor

A post was merged into an existing topic: Targeting and moving a class of elements with Javascript