Как скрыть элемент Div после формы Отправить

сделаем это быстро. Я работаю над сайтом, который принимает номер идентификатора, запрашивает базу данных и затем возвращает данные на одной странице в хорошей таблице. У меня странная проблема, когда inputящик (часть формы) не исчезнет. Вот код, имеющий отношение к этому:

Форма:

<div class="search_box">    
<form method="POST" id="search_form">
        <input type="text" name="person_id" class="submission-boxes" placeholder="Person ID" required><br>
        <input type="submit" name="newperson" class="submission-btn" value="+ Add Person" id="find_em" onclick="SwapDivsWithClick()">
    </form>
</div>

.cssОтношение к форме:

 form{
width: 100%;
display:inline-block;
}
input{
width: 50%;
padding: 20px;
margin-bottom: 10px;
border-radius: 10px;

}

Функция, которая находится echoвнутри phpскрипта:

<script type='text/javascript'>
                        function SwapDivsWithClick()
                            {
                             $( 'div' ).remove( '.search_box' );        
                            }
                </script>"

Это то, что я сейчас пытаюсь сделать в настоящий момент после длинной последовательности проб и ошибок. Я думаю, что проблема заключается в том, когда пользователь отправляет форму, скрипт php выполняется быстрее, чем страница может перезагружаться, поэтому, когда она перезагружается, она наследует стиль из прикрепленной .cssтаблицы стилей. Любые идеи о том, как я могу заставить это работать?

ПРИМЕЧАНИЕ. Я уже пробовал заменить search_boxкласс необходимой информацией. То же самое происходило.

Спасибо всем!