JSFiddle - React, Tailwind, and code Playground

HTML

<div id="previewLink" style="width: 100%; height: 100%; float: left; padding-top: 10px; padding-bottom: 10px; display: block;">
<table style='width: 100%; height: 128px; float: left;'>
	<tr>
		<td style='width:128px;'>
			<a href='#'><img style='width: 128px; height: 128px;' src='' /></a>
		</td>
		<td style='vertical-align: top;'>
			<table>
				<tr>
					<td>
						<div align='left' valign='top' style='float: left; margin-left: 10px; vertical-align: top;'>
							<a href='#'>aaa</a></div>
					</td>
				</tr>
				<tr>	
					<td>
						<div style='float: left; margin-left: 10px; word-wrap: break-word; width: 270px;'>aaa</div>
					</td>
				</tr>
			</table>
		</td>
		<td style='vertical-align: top;'>
			<span class='toRemove' style='cursor: pointer;' onclick='void();'>x</span>
		</td>
	</tr>
</table>
</div>

JavaScript

// try 1
alert($($("#previewLink").not(".toRemove")).html());

// try 2
alert($($("#previewLink :not('.toRemove')")).html());

// try 3
var elemtmp = $("#previewLink").html();
				$(elemtmp).remove(".toRemove");
				preview = $(elemtmp).html();

alert(preview);

// this works, as expected
$("#previewLink .toRemove").remove();