JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <p>
    Your browser can publish or read with WebRTC...
  </p>
  <table id="table">
  </table>

</div>

CSS

table {
  border-collapse: collapse;
}
td {
  border: 1px solid black;
  padding: 15px;
}

JavaScript

let {codecs} = RTCRtpReceiver.getCapabilities('video');
codecs = codecs.map((c) => c.mimeType.replace(/^video\//, ''));
codecs = [...new Set(codecs)];

codecs.forEach((codec) => {
	const row = document.createElement('tr');
  
  const cell = document.createElement('td');
  cell.innerHTML = codec;
  row.appendChild(cell);
  
	document.getElementById("table").appendChild(row);
});