Estoy haciendo una opción que tiene una lista de video que tiene audio y el video que tiene audio y video.
He agregado una clase a los videos que tienen audio y video y quiero que estén al principio de la lista.
Mi código actual
<select id="download-options" class="select_download"> <option value="140">mp4 (only audio)</option> <option value="137">mp4 - 1080p (no audio)</option> <option value="160">mp4 - 144p (no audio)</option> <option value="133">mp4 - 240p (no audio)</option> <option value="18" class="has_video">mp4 - 360p</option> <option value="134">mp4 - 360p (no audio)</option> <option value="135">mp4 - 480p (no audio)</option> <option value="22" class="has_video">mp4 - 720p</option> <option value="136">mp4 - 720p (no audio)</option> </select>Y quiero que sea así
<select id="download-options" class="select_download"> <option value="18" class="has_video">mp4 - 360p</option> <option value="22" class="has_video">mp4 - 720p</option> <option value="140">mp4 (only audio)</option> <option value="137">mp4 - 1080p (no audio)</option> <option value="160">mp4 - 144p (no audio)</option> <option value="133">mp4 - 240p (no audio)</option> <option value="134">mp4 - 360p (no audio)</option> <option value="135">mp4 - 480p (no audio)</option> <option value="136">mp4 - 720p (no audio)</option> </select>Simplemente marque las opciones para la ausencia de class y, si está ausente, muévalas hacia atrás:
const list = document.getElementById('download-options'); for (const option of [...list.options]) { if (!option.className) list.add(option); } list.selectedIndex = 0; <select id="download-options" class="select_download"> <option value="140">mp4 (only audio)</option> <option value="137">mp4 - 1080p (no audio)</option> <option value="160">mp4 - 144p (no audio)</option> <option value="133">mp4 - 240p (no audio)</option> <option value="18" class="has_video">mp4 - 360p</option> <option value="134">mp4 - 360p (no audio)</option> <option value="135">mp4 - 480p (no audio)</option> <option value="22" class="has_video">mp4 - 720p</option> <option value="136">mp4 - 720p (no audio)</option> </select>