title: DataTable; adding icon to select rows
body: <p>I have specific columns in rows where I want to add images to the left of the text. This person (<a href="https://stackoverflow.com/questions/16122924/jquery-datatables-add-country-icons-each-column">jQuery DataTables add country icons each column</a>) had the exact same problem. He wanted to add flags icon to the left of the text within a cell; I want to do basically the same thing (but no flag icons). If every column was going to have an image I would just create another row within the table, but some columns should not have icons so that isn't really an option in this case.</p>
  
  <p>So far in my datatable options I'm doing the following:</p>
  
  <pre><code>  options = {
      "createdRow": function(row, data, index){
        var sharedArray = scope.$eval(attrs.sharedData);
        var rowValue = data[1] + "_" + data[0];
        if ($.inArray(rowValue, sharedArray) != -1){
          $('td', row).eq(0).addClass('shared');
        }
      }
  </code></pre>
  
  <p>At this point I initially thought to use css to add a background image to the .shared element but I ran into two problems, the most important of which it was impossible to add an event on hover if the background image was what was setting the icon.</p>
  
  <p>I then tried to create a span before the row </p>
  
  <pre><code>$(row).prepend('&lt;span class="shared-icon"&gt;&lt;/span&gt;');
  </code></pre>
  
  <p>hoping to then add a background image and hover event to the span, but adding this within the TR caused huge spacing issues with the rows and their respective headers. </p>
  
  <p>I figure I'm missing something relatively simple but have been stuck for a few hours now playing with different datatable functionalities. Thoughts?</p>