Помогите, плиз, начинающему. Задача: Пошаговое переключение между тремя блоками по клику. Шаг№1. клик по кнопке. блок с кнопкой исчезает. появляется блок с формой Шаг№2. клик по кнопке в форме. форма исчезает. появляется блок с сообщением.
Проблема: кликнутые элементы исчезают, но новые не появляются(
Заранее спасибо!
jQuery(document).ready(function($) {
$('.sharebutton').click(function()
{
$('.start').hide();
var form = $('.radioform').css('display') = 'block';
$(form).toggle("fast");
});
$('.send').click(function()
{
$('.radioform').hide();
var message = $('.tellend').css('display') = 'block';
$(message).toggle("fast");
});
});
.radioform {
display:none;
}
.tellend {
display:none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<!--1st block. Button-->
<div class="start">
<span class="tell">Поделись!</span><br><br>
<button class="sharebutton">Делиться!</button>
</div>
<!--2nd block. Form-->
<form class="radioform">
<div class="radio">
<label>
<input type="radio" checked>
через SMS
</label>
<input type="text" placeholder="+380"><br>
</div>
<div class="radio">
<label>
<input type="radio">
через E-mail
</label>
</div> <br>
<div class="form-group">
<button type="submit" class="send">Отправить</button>
</div>
</form>
<!--3rd block. Message-->
<span class="tellend">Спасибо что поделились!</span>
</body>
</html>