Как сменить div при нажатии на определенный radiobutton с помощью JavaScript?

Question

[ASadraliev]

Добрый вечер!
Люди помогите пожалуйста с задачей.
Надо на чистом javascript'e без сторонних библиотек (Jquery и т.п) сделать следующее:
1) Есть 3 радиобаттона, каждой кнопке соответствует определенный DIV блок.
2) При выборе кнопки, должен появляться соответствующий блок, а текущий прячется через css свойство "display:none;"
Для большей ясности привожу пример:
https://jsfiddle.net/on0bzje5/

Может кто-нибудь сталкивался ранее с такой задачей. Помогите пожалуйста с реализацией, весь интернет перерыл не смог толком найти нужное, все примеры с использованием jquery, но он мне не подходит.
P.S: Я пробовал через onclick, но не смог, что то совсем не то... предполагаю, что надо отслеживать состояние "checked", но вот как реализовать не пойму.
Помогите люди добрые!)

Answer 1

[Ivanq]

https://jsfiddle.net/Ivanq/on0bzje5/4/

Код конечно ужасный (и у меня, и, простите, у Вас).
Прошу называть везде одинаково. А то у Вас value="cityOne", а class="CityOne"
И в CSS можно не писать для каждого элемента одно и тоже, а через запятую перечислять, как у меня в примере.

Суть в том, что мы храним текущий выбранный элемент и при выборе другого меняем display

Comments

[ASadraliev]

Спасибо большое за ответ. Я конечно, ещё не совсем понял, как Вы это сделали) Главное, код работает как мне хотелось, буду по-тихоньку его изучать. Да прибудет с Вами сила! + Вашей карме.

Answer 2

[Sergei Nazarenko]

Можно вообще без JS https://jsfiddle.net/pfhzf8qs/

Comments

[ASadraliev]

Спасибо. Интересует только JS)