There's probably a million different ways to do this, but the issue you're always going to have is that in order to get a bulleted list, you usually need HTML and referencing a variable is always going to give you literal text so I think JavaScript is really the best option to get what you want.

Based on what you described, I'd skip the entire workflow/extra field approach and just run your JavaScript directly on the source table (i.e., keep the table on the final form, but hide it and select Save the data, make it read-only, etc., so nothing gets lost).

On that final form, add a custom class to your column field (not the table).

For the sake of the example we will call it "myItem" but you can name it however you like

Then, add a <ul> element to your custom html with an id attribute like "myList"

For example,

<ul id="myList"></ul>

Then, add the following code to your form

$(document).ready(function(){
  // clear list (may not be necessary)
  $('#myList').empty();

  $('.myItem input:not([type=hidden])').each(function(){
    // add list item
    $('#myList').append('<li>' + $(this).val() + '</li>');
  });
});

Now keep in mind, things get more complicated if you want this to work for a saved copy or when looking at the form in the monitoring history because the input elements no longer exist, but if all you care about is showing it that way on the final form in the user task this will do the job.