Switch beetween multi select and select box

Question

This might seem like a strange one but is it possible to remove multiple from a html select box using javascript if it detects that it's a mobile browser?

<select id="plan" name="plan" multiple>

Answer 1

Of course. HTMLSelectElement has a multiple property that you can manipulate.

document.querySelector('button').addEventListener('click', evt => {
  const selectEl = document.querySelector('select')
  selectEl.multiple = !selectEl.multiple
})

<button>Toggle Multiple</button>
<br>
<select multiple>
  <option>1</option>
  <option>2</option>
</select>

You could also manipulate the attribute instead of the property:

document.querySelector('button').addEventListener('click', evt => {
  document.querySelector('select').toggleAttribute('multiple')
})

<button>Toggle Multiple</button>
<br>
<select multiple>
  <option>1</option>
  <option>2</option>
</select>

How to detect a mobile browser is a separate question.