How to replace a certain number with that many X's?

Question

I work at a dealership and Im moving our sales board onto a screen. We use to every time we sell something, we add a X to the board. but now I want to make it simple for my managers to use so I want something like:

This is what I tried

$('#salesperson_tbody').append(`
        <tr>
            <td>${i.name}</td>
            <td>${i.cars_sold.replace('[0-9]', 'X')}</td>
        </tr>
 `);

function salesperson(name,cars_sold) {
    this.name = name`
    this.cars_sold = cars_sold;
};

const Steve = new salesperson(
    'Steve',
    '9.5',
);

but the 9.5 is XXXXXXXXX/. I dont want to replace cars.sold but have a function that replaces the 9.5 for the X's on display. So my manager can input 10 and instead of showing 10 on the screen it has 10 X's.

Answer 1

If a full star is X and half /, then it's quite simple:

$("#button").on("click", () => {
  const stars = parseFloat($("#stars").val());
  if (stars % 1) {
    $("#results").text(`${"X".repeat(Math.floor(stars))}/`);
  } else {
    $("#results").text(`${"X".repeat(stars)}`);
  }
});

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<input type="number" id="stars" min="0" max="10" step="0.5">
<button id="button">See Stars!</button>
<p id="results"></p>