JSFiddle - React, Tailwind, and code Playground

by Qwerty_Wasd

HTML

<div class="vacancy_form">
  <form name="vacancy" method="post" action="/..." class=" needs-validation" data-select2-id="5">
    <div class="d-flex align-items-center v1">
      <div class="select_grey v11">
        <input type="search" id="vacancy_title" name="vacancy[title]" placeholder="Name of vacancy" data-type="vacancy_search" class="ajax-change ajax-keyup form-control">

      </div>
    </div>
    <div class="d-flex v2">
      <div class="select_grey v22" data-select2-id="4">
        <select id="vacancy_organization" name="vacancy[organization]" data-type="vacancy_search" class="ajax-change select_js form-control select2-hidden-accessible" data-select2-id="vacancy_organization" tabindex="-1" aria-hidden="true"><option value="" data-select2-id="2">All organizations</option><option value="19" data-select2-id="8">Organization 1</option><option value="20" data-select2-id="9">Organization 2</option><option value="15" data-select2-id="10">Organization 3</option><option value="2" data-select2-id="11">Organization 4</option><option value="17" data-select2-id="12">Organization 5</option><option value="16" data-select2-id="13">Organization 6</option></select><span class="select2 select2-container select2-container--default select2-container--below" dir="ltr" data-select2-id="1" style="width: 190px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-disabled="false" aria-labelledby="select2-vacancy_organization-container"><span class="select2-selection__rendered" id="select2-vacancy_organization-container" role="textbox" aria-readonly="true" title="Organization 6">Organization 6</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span>

      </div>

      <div class="v23">
        <ul class="nav nav-pills nav-pills-form form_suburb_nav"...

JavaScript

function resetButtonBind() {
    $(document).on('click', '.reset_button', function() {
        $(this).parents('form').find('input[type="radio"]').removeAttr('checked');
        $('#vacancy_position_placeholder').attr('checked','checked');
//        $('#vacancy_active_1').attr('checked','checked');
        $(this).parents('form').find('select option').removeAttr('selected');
        $(this).parents('form').find('input[type="search"]').removeAttr('value');
        setTimeout(function() {
            $(this).parents('form').trigger('change');
        }, 1000);
    });
}