JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<button type="button" id="change">
Display in centimeters
</button>

<input type="radio" id="converted" checked="">
<table>
  <thead>
<tr>
<th> Size</th>
<th>XS</th>
<th>S</th>
<th>M</th>
<th>L</th>
<th>XL</th>
</tr>
  </thead>
   <tbody id="data">
<tr>
<th>CHEST</th>
<td>32" - 34"</td>
<td>35" - 37"</td>
<td>38" - 40"</td>
<td>41" - 43" </td>
<td>44" - 46"</td>
</tr>
<tr>
<th>WAIST</th>
<td>26" - 28"</td>
<td>29" - 31"</td>
<td>32" - 34"</td>
<td>35" - 37"</td>
<td>38" - 40"</td>
</tr>
<tr>
<th>SEAT / HIP</th>
<td>32" - 34"</td>
<td>35" - 37"</td>
<td>38" - 40"</td>
<td>41" - 43"</td>
<td>44" - 46"</td>
</tr>
<tr>
<th>SLEEVE</th>
<td>24.8"</td>
<td>25.1"</td>
<td>25.6"</td>
<td>26"</td>
<td>26.4"</td>
</tr>
</tbody>
</table>

CSS

td {
  padding: 10px;
}

JavaScript

$(document).on('click', ' #change', function(e) {
  if($('#converted').is(':checked')) {
   $('#data td').html('cm');
   alert("converted to cm");
   $('#change').html('Display in inches');
   $('#converted').prop('checked', false);
  } else {
  $('#data td').html('in');
  $('#converted').prop('checked', true);
  $('#change').html('Display in centimeters');
  alert("converted to in");
}
});