Finding next instance of class name outside of parent div of div clicked?

Question

If you have

<div id="sf_53" class="req">
    <div class="expF"><a href="#">CLICK HERE</a></div>
</div>
<div class="exp"></div>

and your click function was activated by "expF", how do you add html to the next instance of "exp"?

I thought knowing the main parent div would make it like

$("#sf_53").nextAll(".exp").html("Howdy!");

Thanks for taking a look.

Answer 1

use .closest() with .next():

 $(this).closest('.req').next().html('somehtml');

Working Demo

Answer 2

Since id must be unique, you can just use .next() to get the next immediate sibling of #sf_53 element which is .exp div:

$('.expF').click(function() {
    $('#sf_53').next().html("Howdy"!);
});