[Mrs.Haneki]

Доброе утро! помогите пожалуйста скорректировать код. Когда поле в фокусе, то показываем иконку и отчищаем введенный текст. когда не в фокусе то убираем. Я написала код, он показывает и убирает иконку, но не очищает текст. Хотя событие на очистку поля стоит.

Идеально сделать бы как в поиске Яндекс. когда ввели текст, то появляется кнопка очистить

<input id="searchDeliverySector" name="searchDeliverySector" type="text" class="form-control" maxlength="500">
            <span class="btn-clear" onclick="ClearSearchFields(['searchDeliverySector']); searchDepartments();" style="display: none;">
                <img src="/Content/Images/icon-clear.png" alt="">
            </span>

$(document).ready(function () {
        $('#searchDeliverySector').focus(function () {
            $('span.btn-clear').show();
        });

        $('#searchDeliverySector').blur(function () {
            $('span.btn-clear').hide();
        });
    });