Hide row elements if they appear in the row above

I'm working on a static HTML page that contains an agenda for an event that will have multiple breakout sessions at one time. For the less complex agendas, I was able to simply remove the time element for sessions at the same time as in the row above it. (Like here: https://theanswerco.com/customerevent2019/edmontonagenda.html)

However, one day's events needed an option for filtering by product. If I remove the time elements, then when it is filtered, it appears with no time. (As in 'Thursday' tab here: https://theanswerco.com/customerevent2019/vancouveragenda.html)

I'm wondering if there's a way to add the same class to time buttons for sessions that happen at the same time and use Javascript to dynamically hide those elements if they are preceded in the row above by an element of the same class?

It might not be possible, but I thought I'd check! Thanks.