JSFiddle - React, Tailwind, and code Playground
HTML
<div class="product-intro-text">Some text....
<div class="rfq-button"><a class="advantage-button" id="Adapters" href="#">Request a Quote</a></div>
</div>
<div class="h-sep"></div>
<div class="product-intro-text">Some text....
<div class="rfq-button"><a class="advantage-button" id="Auger Equipment" href="#">Request a Quote</a></div>
</div>
<div class="inline-rfq">
<form class="contact" name="contact" action="#" method="post">this is the stuff</form>
</div>
CSS
.inline-rfq{display:none;}
JavaScript
jQuery(document).ready(function($) { /* toggle form */
$(".rfq-button").on("click", function() {
var $thisParent = $(this).closest('.product-intro-text'),
$form = $(".inline-rfq");
if ($thisParent.find('.inline-rfq').length) {
$form.show();
} else {
$form.hide(function() {
$form.appendTo($thisParent).show()
});
}
});
});