Sort locales in the order you choose

  • Match internal map?
// Some code
// Get the parent element
const parentElement = document.getElementById('id-for-michael');
// Get all divs within the parent element that have the attribute data-wf-locale-display-name
const divs = parentElement.querySelectorAll('div[data-wf-locale-display-name]');
// Create a mapping of display names to their respective divs
const divMap = {};
divs.forEach(div => {
const displayName = div.getAttribute('data-wf-locale-display-name');
divMap[displayName] = div;
// Define the desired order
const order = ['Chinese', 'Spanish', 'English'];
// Create a new array in the desired order
const sortedDivs = => divMap[displayName]);
// Remove existing divs from the DOM
divs.forEach(div => div.remove());
// Append divs in the new order to the parent element
sortedDivs.forEach(div => parentElement.appendChild(div));
CREDIT - Ida from Webflow support, for the approach idea.
Last modified 1mo ago