Improving a function from using 1-D arrays to 2-D arrays as argument The problem:

I have a function that writes an array it takes as argument to a div, in a single line.

Example:
writeToOutput([1,2,3]) outputs
    1,2,3

The aim is to improve this function, to be able to take an array of arguments, and display them on several lines

Example: writeToOutput([[1,2,3],[4,5,6]]) outputs

1,2,3
4,5,6


An obvious solution is to use writeToOutput([[1,2,3]]) to replicate the previous results, however, the function call with a 1-D array is already used by several scripts, and I would like them to keep working.

The code:

function writeToOutput(values, outputName) {
  var outputDiv = document.getElementById(outputName)
  var outputText = "";

  if (!Array.isArray(values[0])) {
    values = [values]
  }

  var valuesSubArray;
  for (var i = 0; i &lt; values.length; i++) {
    valuesSubArray = values[i];
    outputText = "";
    for (var j = 0; j &lt; valuesSubArray.length; j++) {
      outputText += valuesSubArray[j]
    }
    if (i &gt; 0) {
      outputDiv.innerHTML += "&lt;/br&gt;";
    }
    outputDiv.innerHTML += outputText;
  }
}


What I am interested in:

As you may have guessed, I don't really care about writing numbers to a div, but I have a legacy function that takes a 1-D array, and I would like it to deal with 2-D arrays without breaking existing implementation.

I am interesting in figuring out if the trick with Array.isArray(values[0]) is the best way to do this, or if there is more performant, more widely used, etc. ways to do this. (The project is using jQuery).

Altought this stub has been made to sugarcoat the 1-D -> 2-D array, I am eager to learn, and if there is an obvious improvement to be made, please let me know!
Regarding your main question
From my point of view, yes, your current solution to allow legacy 1-D arrays to work with your new version is the best one I can think.
Rather funny: I just proposed a close solution in a PHP context question, less than 24 hours ago!
Another obvious method might be to keep the legacy function as is, and to write an almost identical one (simply expecting only 2-D arrays) with an alternative name.
But it doesn't seem better at all, notably because in case of changes regarding the core job they do, these two functions should be both updated!
Now since you asked for other possible improvements
I know that your example is not a real one, but since you implemented it &quot;seriously&quot; I propose you some points you might consider.
Performance
for (var i = 0; i &lt; values.length; i++) {
  // ...
}

With the above code (your outer loop), values.length is evaluated for each step while looping, that may become significative when length is high.
A well known best practice is to avoid it, using this instead:
for (var i = 0, n = values.length; i &lt; n; i++) {
  // ...
}

This way, values.length is evaluated only once.
Simplification
Anyway, instead of the above code you can use this alternative construction, resulting in a simpler code:
values.forEach(function(valuesSubArray, i) {
  // ...
});

NOTE: with this construction, you can also drop the previous declaration var valuesSubArray;.
Again simplification, and probably also performance
outputText = &quot;&quot;;
for (var j = 0; j &lt; valuesSubArray.length; j++) {
  outputText += valuesSubArray[j]
}

The above code (your inner loop) can be replaced by this simple statement:
outputText = valuesSubArray.join('');
NOTE: this results in 123 for a sub-array like [1, 2, 3], like does your outputText += valuesSubArray[j]. If you rather want to get 1,2,3 as stated by the initial explanation in your OP, you must use outputText = valuesSubArray.join(','); instead.
More simplification
At a higher level we can observe that the whole desired result outputDiv.innerHTML structure is the same as the outputText's one`:

each element is the current outputText
the separator is &lt;br /&gt; instead of a comma

So we can use join('&lt;br /&gt;') at this level, applying it to an array of the generated outputTexts. This array can be obtained using reduce():
values.reduce(
  function(result, valuesSubArray) {
    result.push(valuesSubArray.join(','));
    return result;
  },
  []
);

NOTE: we don't need using i any longer, nor previously declaring outputText.
Finally
We can completely drop any variable declaration, and achieve the whole job with a &quot;one-liner&quot;:


function writeToOutput(values, outputName) {
  if (!Array.isArray(values[0])) {
    values = [values]
  }
  
  document.getElementById(outputName).innerHTML = 
    values.reduce(
      function(result, valuesSubArray) {
        result.push(valuesSubArray.join(','));
        return result;
      },
      []
    )
    .join('&lt;br /&gt;');
}

writeToOutput([[1, 2, 3], [4, 5, 6]], 'outputs');
&lt;div id="outputs"&gt;&lt;/div&gt;