<button class="volumen-btn" onclick="niceFunction()>
<i class="fa fa-volume-up"></i>
</button>
<div class="volume-control-container" id="container1" style="display:none;">
<input type="range" name="blabla" class="volume-range" id="range1">
</div>
<div class="randomdiv">
</div>
<!-- New Volume Button -->
<button class="volumen-btn" onclick="niceFunction()>
<i class="fa fa-volume-up"></i>
</button>
<div class="volume-control-container" id="container1" style="display:none;">
<input type="range" name="blabla" class="volume-range" id="range1">
</div>
JS Function
$(document).ready(function () {
$(".volume-btn").click(function() {
volumeControl();
});
});
function volumeControl(){
$(this).siblings('.volume-control-container').toggle()
}
With JavaScript, when clicking on the volume button, I want to toggle the display of the closest volume control container. Despite searching for solutions, I couldn't find one that fits my specific requirements.
JsFiddle Link : http://jsfiddle.net/eltonfrederik/4Pa4g/1