Есть код отображения div-ов в зависимости от выбранных значений select-ов. Но он не отображает вложенный код. Т.е. Если в блоке есть просто текст, то он отобразится, но если внутри есть ещё блок, то он не отобразится. Подскажите, пожалуйста, как это исправить? Код ниже:
$(function() {
$("#people, #days").on("change", function() {
$(".all-price div, .all-blocks div").hide();
$("#pr" + $("#people").val() + '-' + $("#days").val()).show();
$("#bl" + $("#people").val() + '-' + $("#days").val()).show();
});
});
.podbor {
display: block;
}
.drop {
cursor: pointer;
overflow: hidden;
display: inline-block;
position: relative;
border-radius: 3px;
padding: 10px;
outline: 0;
letter-spacing: .2px;
border: 1px solid #ecebeb;
}
.all-price {
font-size: 18px;
font-weight: bold;
display: inline-block;
padding: 10px 20px;
}
.all-price>div {
display: none
}
.all-blocks {
width: 300px;
height: 300px;
background-color: #f9f9f9;
}
.all-blocks>div {
display: none
}
#pr2-5, #bl2-5{
display:block;
}
.1c3d{width:100px;height:50px;background-color:red;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="podbor">
Для
<select class="drop" id="people">
<option value="1">1-го</option>
<option value="2" selected>2-х</option>
<option value="s">семьи</option>
</select>
на
<select class="drop" id="days">
<option value="3">3 дня</option>
<option value="5" selected>5 дней</option>
</select>
<div class="all-price">
<div id="pr1-3">Цена для 1-го на 3 дня ХХХХХХ</div>
<div id="pr1-5">Цена для для 1-го на 5 дней ХХХХХХ</div>
<div id="pr2-3">Цена для 2-х на 3 дня ХХХХХХ</div>
<div id="pr2-5">Цена для 2-х на 5 дней ХХХХХХ</div>
<div id="prs-3">Цена для семьи на 3 дня ХХХХХХ</div>
<div id="prs-5">Цена для семьи на 5 дней ХХХХХХ</div>
</div>
</div>
<div class="all-blocks">
<div id="bl1-3">Содержимое блока для 1-го на 3 дня</div>
<div id="bl1-5">Содержимое блока для 1-го на 5 дней</div>
<div id="bl2-3">Содержимое блока для 2-х на 3 дня<div class="1c3d">Вот такая Хурма!</div></div>
<div id="bl2-5">Содержимое блока для 2-х на 5 дней</div>
<div id="bls-3">Содержимое блока для семьи на 3 дня</div>
<div id="bls-5">Содержимое блока для семьи на 5 дней</div>
</div>