JSFiddle - React, Tailwind, and code Playground

HTML

<div id="btn_busca"><span>BUSCA AVAN&Ccedil;ADA</span>
                         <div id="busca-avan">
                        <form id="form-avancada" >
                            <div class="box-select">
                                <select name="pFabricante" id="">
                                    <option value="">asdasd</option>
                                    <option value="">asdasd</option>
                                    <option value="">asdasd</option>
                                    <option value="">asdad</option>
                                </select>
                            </div>
                             </form>
    </div>

JavaScript

var buscaAvan = document.getElementById("btn_busca");
var buscaAvanForm = document.getElementById("busca-avan");
var buscaItens = buscaAvanForm.querySelectorAll("*");
var target;
$("#btn_busca").find('span').click(function(){
		show_form();
});
$(buscaAvanForm).on("mouseout",function(event) {
	target =  event.relatedTarget ? event.relatedTarget : event.fromElement;
	console.log(target);
	target = event.relatedTarget === undefined ? buscaAvanForm : target;
	if(!inArray(target, buscaItens) ){
		hide_form();
		return false;
	}
});

function inArray(needle, haystack) {
    var length = haystack.length;
    for(var i = 0; i < length; i++) {
        if(haystack[i] == needle) return true;
    }
    return false;
}
function show_form() {
	$("#busca-avan").slideDown(300).addClass("opened");
	return false;
}
function hide_form() {
	$("#busca-avan").slideUp(300).removeClass("opened");

	return false;
}