title: remove everything (elements and text) after a given child element
body: <p>I am working in our Gmail extension right now, and given that the I have the parent Element and it looks something like below, I need to remove everything after <code>&lt;br clear="all" /&gt;</code>, given that what is after may or may not exist given the users Gmail signature settings. Thoughts?</p>
  
  <pre><code>&lt;div
      id=":93"
      class="Am Al editable LW-avf"
      hidefocus="true"
      aria-label="Message Body"
      g_editable="true"
      role="textbox"
      aria-multiline="true"
      contenteditable="true"
      tabindex="1"
      style="direction: ltr; min-height: 416px;"&gt;
      Test
      &lt;br clear="all" /&gt;
      &lt;div&gt;
          &lt;br /&gt;
      &lt;/div&gt;
      -- &lt;br /&gt;
      &lt;div dir="ltr" class="m_-1358982132021700848m_4914548661371847332gmail_signature" data-smartmail="gmail_signature"&gt;
          &lt;div dir="ltr"&gt;
              &lt;b&gt;Suzy Smith&lt;/b&gt;
              &lt;div&gt;
                  &lt;i&gt;&lt;a href="mailto:suzysmith@mail.com" target="_blank"&gt;suzysmith@mail.com&lt;/a&gt;&lt;/i&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>