Как я понял, у меня либо жесткое наложение, либо просто не видно куда и что тыкается. (не работает другими словами) После разбора всех атрибутов, я дошел до того что 1 кружок ставится НЕ зависимо куда ты тыкнешь. Тут уже было понятно, что это :after вешается по id (как мы и писали) и только на первый элемент. Поэтому решение нашел стремное, а именно я динамически передаю новые id, на каждую итерацию цикла. Т.е. 4 id из state, после уже в стили делаю такие как и были :after+label и тд. Нужный функционал то я получил, но весь дерьмо код - вижу. Если у вас будут лучшее решение, чем мое - с радостью узнаю и попробую!
Зачем вообще мне нужен был state? Дело в том, что именно вот эти цифры ( цена) отправляется к нам в базу, и по клику динамически (там еще есть ниже верстка) перемещаем туда тоже. Т.е. можно было без state, но писать доп.кода нет смысла, да и ошибки будут 100%.