Как убрать родительский флажок в LI, если флажок не существует в дочернем LI с JQuery

Question

<ul ="staffTree">
    <li>
        <input type="checkbox" name="selectedNode" id="selectedNode" value = "Manager">
        Manager
        <ul>
            <li>
                <input type="checkbox" name="selectedNode" id="selectedNode" value = "AsstManager">
                Asst. Manager
                <ul>
                    <li>
                        <img src="images/not_allowed.png" title="Not Allowed">
                        Staff Member 1
                    </li>
                    <li>
                        <img src="images/not_allowed.png" title="Not Allowed">
                          Staff Member 2
                    </li>
                    <li>
                        <img src="images/not_allowed.png" title="Not Allowed">
                          Staff Member 3
                    </li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

В этом примере ни один сотрудник не имеет флажка, поэтому я хочу заменить поле ввода Asst. Менеджер с этим изображением "Не разрешено". Если какой-либо флажок существует в любом li. Тогда родитель также будет содержать флажок. И супер родитель (менеджер) тоже будет иметь. Дерево будет иметь уровень N.

Я пытаюсь сделать селектор jQuery для него. И нужен указатель на него.

Answer 1

$('#staffTree li > input:checkbox').each(function () {
  var $this = $(this);
  if ($this.siblings().has('li > input:checkbox').length) {
    return;
  }
  $this.replaceWith('<img src="images/not_allowed.png" title="Not Allowed">');
});

вот скрипка http://jsfiddle.net/823vR/