When looking for the next element id in Jquery the simplest solution is to use closest(element). but it is not working for Canvas and I don’t know why.
$('a.findNext').click(function() {
debugger;
var nextSectionWithId = $(this).closest("canvas").nextAll("canvas[id]:first");
if (nextSectionWithId) {
var sectionId = nextSectionWithId.attr('id');
$("#test").text(sectionId)
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="section_1">
<a href="#" class="findNext">Find</a>
</div>
<div></div>
<canvas id="section_3"></canvas>
<canvas id="section_4"></canvas>
<div id='test'></div>