JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css" >
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap.min.js"></script>

<body>
  <nav class="navbar navbar-inverse">
    <div class="container-fluid">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">example</a></li>
      </ul>
    </div>
  </nav>


  <div class="container-fluid">
    <table id="table1" class="table table-striped table-bordered">
      <thead class="thead-inverse">

        <tr style="border-width: 1px">
          <th class="text-nowrap">Col0</th>
          <th class="text-nowrap">Col1</th>
          <th class="text-nowrap">col2</th>
          <th class="text-nowrap">col3</th>
          <th class="text-nowrap">Comments</th>
          <th class="no-sort"></th>
        </tr>
      </thead>

      <tbody>

          <tr style="border-width: 1px;">
            <td>Lorem</td>
            <td >Ipsum</td>
           <td>Lorem</td>
             <td >error</td>
            <td>
              <textarea class="form-control" rows="1" id="comment" style="width: 100%">
              </textarea>
            </td>
            <td align="center">
              <button type="button" class="btn" id="button1">button</button>
            </td>
          </tr>
          <tr style="border-width: 1px;">
            <td>Lorem</td>
            <td >Ipsum</td>
           <td>Lorem</td>
             <td >Ipsum</td>
            <td>
              <textarea class="form-control" rows="1" id="comment" style="width: 100%">
              </textarea>
            </td>
           ...

JavaScript

$(document).ready(function() {
  $('#table1').DataTable({
    "bFilter": false,
    "ordering": true,
    columnDefs: [{
      orderable: false,
      targets: "no-sort"
    }],
    "paging": false,
    drawCallback: function(settings) {
      $('#table1 tr').each(function() {
        var Cell = $(this).find('td:eq(3)');
        debugger;
        if (Cell.text() !== 'error') {

          $(this).find('button').hide();
          $(this).find('textarea').hide();

        } else {

          $(this).parent().on('mouseover', 'tr', function() {
            $(this).css('background-color', '#ff66ff');

            $(this).bind("mouseout", function() {
              $(this).css('background-color', '');
            });

          });
        }

      });
    },


  });


});