Если все таки будете использовать JS то попробуйте
ajax.
Если кратко при нажатии на кнопку аякс скрипт будет отправлять указанные вами данные на бэкэенд, где php обработчик подготовит нужные данные, например выберет нужные строки из БД. (там же лучше все сверстать сразу что бы потом через js не прописывать) и отправит их обратно пользователю и выведет в указанный вами блок.
Данный способ все таки более предпочтителен чем выкидывать на страницу все возможные варианты сразу и потом их фильтровать. (как размер самой страницы, так и возможно вывод каких то персональных, приватных данных в общем потоке)
Если же без использования JS
То.
1. выводим все данные на страницу с обязательным укзаанием ID блоков.
2. Кнопки делаем ссылками с указанием id связанного блока
Кнопка
3. В CSS прописываем скрытие всех под элементов - display: none
4. В CSS используем псевдокласс :target {display:block;}
span{
display: none;
}
span#element:target{
display: block;
}
Логика
При нажатии на кнопку элемент с указанным в нем ID получает псевдо класс :target который можно использовать в css
Из недостатков - больше 1 элемента вы на такую цепочку не повесите. Т.е. если надо с "таргет" блока открыть какой то следующий, то следующий откроется, но для текущего слетит таргет и он снова будет не виден.
