data attributes being lost when displaying html using javascript on Chrome

I have javascript code which loads html content into a div tag. The problem is that few data attributes are not being displayed when this is loaded in Chrome browser. The problem does not happen in Firefox. The actual html code is generated by a perl script and written offline into a .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 pastebin of the 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'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.
    </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 pastebin of the loaded html (via console.log): html in Chrome

data-NextEpisode, data-Genre, data-lastaired etc are all lost while displaying in Chrome. Why is this happening? How can I avoid this?

In Firefox:

In Chrome: