jquery вложенное событие li click вызывает несколько раз

У меня следующая структура.

<ul id="browser" class="filetree">

        <li><span class="folder">Folder 1</span>

            <ul>

                <li><span class="file">Item 1.1</span></li>

            </ul>

        </li>

        <li><span class="folder">Folder 2</span>

            <ul>

                <li><span class="folder">Subfolder 2.1</span>

                    <ul id="folder21">

                        <li><span class="file">File 2.1.1</span></li>

                        <li><span class="file">File 2.1.2</span></li>

                    </ul>

                </li>

                <li><span class="file">File 2.2</span></li>

            </ul>

        </li>

        <li class="closed"><span class="folder">Folder 3 (closed at start)</span>

            <ul>

                <li><span class="file">File 3.1</span></li>

            </ul>

        </li>

        <li><span class="file">File 4</span></li>

    </ul>

В js У меня есть следующая функция.

$("#browser li").click(function(){


});

Когда я щелкнул файл li 2.1.1. Функция вызывается 3 раза

первый раз для файла li 2.1.1 , второй раз для подпапки li 2.1 и третий раз для папки li 2.

Может ли кто-нибудь дать мне решение для вызова функции ровно один раз?

Мы очень признательны за вашу помощь. Спасибо.