toggleClass
, как написали выше, но у вас в описании задачи не сказано ничего про классы. <body>
<div>
<button>Подробнее</button>
<div class="modal-content">Контент</div>
</div>
<div class="modal">Модальное окно</div>
<script>
$(document).ready(function() {
$('button').click(function() {
var content = $(this).parent().find('.modal-content').clone();
$('.modal').html(content);
$('.modal').show('show');
})
});
</script>
</body>
<div itemscope="" itemtype="http://schema.org/BreadcrumbList" id="breadcrumbs">
<span itemscope="" itemprop="itemListElement" itemtype="http://schema.org/ListItem">
<a rel="nofollow" itemprop="item" title="Главная" href="http://prodengiblog.ru">
<span itemprop="name">На Главную</span>
<meta itemprop="position" content="1">
</a>
</span>
<span itemscope="" itemprop="itemListElement" itemtype="http://schema.org/ListItem">
<a itemprop="item" title="Оптимизация" href="http://prodengiblog.ru/optimizaciya">
<span itemprop="name">Оптимизация</span>
<meta itemprop="position" content="2">
</a>
</span>
</div>
<a href="#">
<div>
<img src="#">
</div>
</a>
<a href="#">
<div>
<div>
<p>Контент</p>
<img src="#">
<svg width="230" height="140">
<rect x="5" y="5" width="220" height="130" fill="skyblue" stroke="steelblue" stroke-width="5" />
</svg>
</div>
</div>
</a>
Показываете первый шаг, остальные скрываете. Юзер заполнил первый шаг, нажал "Далее", скрыли первый шаг, показали второй. В самом конце, при нажатии на кнопку "Отправить", собираете какие данные юзер выбирал на предыдущих шагах и отправляете куда вам нужно.