Data attributes get lost when rendering html using javascript in Chrome

I have a javascript code that loads html content into a div tag. The problem is that when loading in Chrome browser, multiple data attributes are missing. The problem does not occur in Firefox. The actual html code is generated by the perl script and written offline to the .html file.

Jquery code to load the following HTML code:

$.get("/allshows.html", function(html_string)
   {
      $( "#imgthingy" ).html(html_string);
 },'html');    

      

        
        
        
      

    

html code:

<div class="fade-area-2">
    <a href="Under the Dome" data-toggle="modal" data-target="#ShowModal" data-sorting="Under the Dome" data-image="http://assets.fanart.tv/fanart/tv/264492/tvthumb/under-the-dome-51cc511a76f1a.jpg" data-NextEpisode="S3E13" data-Genre="Drama | Science-Fiction | Thriller " data-lastaired="S3E13" data-Premiered="2013-06-24" data-Status="Ended" data-TotalSeasons="0" data-summary="&lt;p&gt;&lt;b&gt;Under the Dome&lt;/b&gt; is the story of a small town that is suddenly and inexplicably sealed off from the rest of the world by an enormous transparent dome. The town&#39;s inhabitants must deal with surviving the post-apocalyptic conditions while searching for answers about the dome, where it came from and if and when it will go away.&lt;/p&gt;" class="nocli">
        <img src="http://assets.fanart.tv/fanart/tv/264492/tvthumb/under-the-dome-51cc511a76f1a.jpg" class="img-rounded" style="width: 140px; height: 140px; margin-right:10px; margin-bottom:10px;">
    </a>
    <a href="Person of Interest" data-toggle="modal" data-target="#ShowModal" data-sorting="Person of Interest" data-image="http://assets.fanart.tv/fanart/tv/248742/tvthumb/person-of-interest-588d94ea26e7f.jpg" data-NextEpisode="S5E13" data-Genre="Drama | Action | Crime " data-lastaired="S5E13" data-Premiered="2011-09-22" data-Status="Ended" data-TotalSeasons="0" data-summary="&lt;p&gt;You are being watched. The government has a secret system, a machine that spies on you every hour of every day. I know because I built it. I designed the Machine to detect acts of terror but it sees everything. Violent crimes involving ordinary people. People like you. Crimes the government considered &quot;irrelevant&quot;. They wouldn&#39;t act so I decided I would. But I needed a partner. Someone with the skills to intervene. Hunted by the authorities, we work in secret. You&#39;ll never find us. But victim or perpetrator, if your number is up, we&#39;ll find you.&lt;/p&gt;" class="nocli">
        <img src="http://assets.fanart.tv/fanart/tv/248742/tvthumb/person-of-interest-588d94ea26e7f.jpg" class="img-rounded" style="width: 140px; height: 140px; margin-right:10px; margin-bottom:10px;">
    </a>
</div>

      

        
        
        
      

    

Full pate of html file: htmlfile

Unfortunately, in Chrome it looks like this:

<div class="fade-area-2">
  <a href="Under the Dome" data-toggle="modal" data-target="#ShowModal" data-sorting="Under the Dome" data-summary="
    <p>
        <strong>Under the Dome</strong> is the story of a small town that is suddenly and inexplicably sealed off from the rest of the world by an enormous transparent dome. The town inhabitants must deal with surviving the post-apocalyptic conditions while searching for answers about the dome, where it came from and if and when it will go away.
    </p>" data-image="http://assets.fanart.tv/fanart/tv/264492/tvthumb/under-the-dome-51cc511a76f1a.jpg" data-nextepisode="" data-genre="" data-lastaired="" data-premiered="" data-status="" data-totalseasons="" class="nocli">
    <img src="http://assets.fanart.tv/fanart/tv/264492/tvthumb/under-the-dome-51cc511a76f1a.jpg" class="img-rounded" style="width: 140px; height: 140px; margin-right:10px; margin-bottom:10px;">
    </a>
     <a href="Person of Interest" data-toggle="modal" data-target="#ShowModal" data-sorting="Person of Interest" data-summary="
    <p>You are being watched. The government has a secret system, a machine that spies on you every hour of every day. I know because I built it. I designed the Machine to detect acts of terror but it sees everything. Violent crimes involving ordinary people. People like you. Crimes the government considered &quot;irrelevant.&quot; They wouldn't act so I decided I would. But I needed a partner. Someone with the skills to intervene. Hunted by the authorities, we work in secret. You'll never find us. But victim or perpetrator, if your number is up, we'll find you.</p>" data-image="http://assets.fanart.tv/fanart/tv/248742/tvthumb/person-of-interest-588d94ea26e7f.jpg" data-nextepisode="" data-genre="" data-lastaired="" data-premiered="" data-status="" data-totalseasons="" class="nocli">
    <img src="http://assets.fanart.tv/fanart/tv/248742/tvthumb/person-of-interest-588d94ea26e7f.jpg" class="img-rounded" style="width: 140px; height: 140px; margin-right:10px; margin-bottom:10px;">
  </a>
</div>

      

        
        
        
      

    

Full pate of loaded html (via consolelog): html in Chrome

data-NextEpisode

, data-Genre

, data-lastaired

Etc. all are lost while displaying in Chrome. Why is this happening? How can I avoid this?

In Firefox:

In Chrome: