title: AJAX returns wrong charset in IE
body: <p><strong>What I'm trying to do</strong></p>
  
  <p>I am using $.get() on index.html page to get the contents of otherpage.html located on the same server and then display it in a <code>DIV</code> on index.html page. Both pages contain some accented characters (think Spanish, French and German) and are encoded with <code>iso-8859-1</code>. </p>
  
  <p>Since both pages are generated with a 3rd party 'wysiwyg html authoring tool', I cannot change the encoding of the pages and I have no control over how servers are setup. I can only add my JS code.</p>
  
  <p><strong>So what went wrong?</strong></p>
  
  <p>It all works perfect in Chrome, Firefox, Safari and Opera. However, IE10/9/8/7 returns garbled text. I get empty squares <code>` instead of</code>ö<code>,</code>å<code>and</code>ä`. I have searched all of Stackoverflow (ISO-8859-1 seems to cause a lot of headache) and my code includes most of those tips for enforcing encoding in headers etc. No success :(</p>
  
  <p><strong>Ok, show us your code!</strong></p>
  
  <p>I have setup test case on two servers: <a href="http://goo.gl/5C6zE" rel="nofollow">test one</a> and <a href="https://dl.dropbox.com/u/11433463/stack/index.html" rel="nofollow">test two</a>. The code is below:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /&gt;
  &lt;title&gt;the first page&lt;/title&gt;
  &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" charset="iso-8859-1"&gt;
  function GetData() {
  
  $.ajaxSetup({
      beforeSend: function(jqXHR) {
              jqXHR.overrideMimeType('text/html; charset=iso-8859-1')
              jqXHR.setRequestHeader('Accept','text/html; charset=iso-8859-1');
      },
      timeout:5000,
      contentType: 'text/html; charset=iso-8859-1',
      dataType: 'html',
      mimeType: 'text/html; charset=iso-8859-1',
      processData: false
  })
  
  $.post( 'otherpage.html' )
   .done( function(pagedata) { 
      console.log(pagedata)
      $('#result').html(pagedata);
   })
   .fail( function() { 
      $('#result').html('Request failed');
   })
  
  }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;input type="submit" value="Get data" onclick="GetData()"&gt;
  &lt;div id="intro"&gt;Some characters: ö--å--ä.&lt;/div&gt;
  &lt;div id="result"&gt;Click "Get data".&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>otherpage.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /&gt;
  &lt;title&gt;the other page&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div&gt;Hälsyt högg lått Xöööööööööz Zååååååååååååy Kääääääääääännn &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>So your question is...?</strong></p>
  
  <p>What should I do in Javascript to make sure the text display correctly in IE10/9/8/7? I appreciate any constructive ideas.</p>