JSFiddle - React, Tailwind, and code Playground

by chridam

HTML

<table>
<tbody>
  <tr class="master">
    <th rowspan="2" scope="row" class="toggle">Toggle</th>
    <td id='imageList'>http://source.to/image.png</td>
    <td>Column 3</td>
  </tr>  
</tbody>
</table>

CSS

td, th {border: 1px solid black;}
tr.child {display:none;}
tr.child.toggled {display:table-row;}
th.toggle {cursor:pointer;}

JavaScript

var src = $("td[id^='imageList']").val();
var img = $('<img />').attr({ 
    'id': 'Myid', 
    'src': src, 
    'alt':'MyAlt' 
});
$("td[id^='imageList']").empty().append(img);