title: Aria-live not working when focus put on another field
body: <p>I am writing a very simple SPA application that has a single read-only 'output' field, followed by a single input field. When the user types an input command and hits enter, the JavaScript writes text into the output field. I want the screen reader to read this output straight away without the user having to navigate to the output field, so I added aria-live, thus:</p>
  
  <pre><code>&lt;div&gt;
      &lt;div class="output" aria-live="polite"&gt;{{myViewModel.output}}&lt;/div&gt;
      &lt;input type="text" myAngularDirective /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>In the first iteration this worked exactly as I wanted.  However, some of the commands change the Url (though rendered using the same view) and I wanted to ensure that the focus is left on the input field, and in most cases, the input field is cleared for the next command.  When I add code either to focus on the input, or modify it, the output still renders fine on the screen but is no longer read out by the screen reader.</p>
  
  <p>I've tried:</p>
  
  <ul>
  <li>Changing (in the JavaScript) the order of writing the output and
  clearing/focussing on the input</li>
  <li>Upping the aria-live to 'assertive'</li>
  <li>Adding aria-live to the input also (not sure why I thought that would
  help)</li>
  <li>Moving the aria-live from the output field to the surrounding    div</li>
  </ul>
  
  <p>None has made a difference.  If I remove the focus/clear logic, all works well again.  There is some subtlety about how aria-live works that I am missing: any help appreciated.</p>