<select id="languages" class="languages">
  <option value="">Change Language</option>
{% for lang in site.languages %}
  <option value="{{ lang.path }}">{{ lang.label }}</option>
{% endfor %}
</select>

<script type="text/javascript">
( function(){
	'use strict';
	var langs = document.getElementById( 'languages' );

	// Only apply this after we set the Selected option.
	langs.onchange = function( ev ) {
		if ( ev.currentTarget && ev.currentTarget.value ) {
			location.href = ev.currentTarget.value;
		}
	};

	if ( '/' === window.location.pathname ) {
		return;
	}

	var opts = langs.getElementsByTagName( 'option' ),
		count = opts.length;

	for ( var i = 0; i < count; i++ ){
		// Only happens if you have language path on the start of the location.pathname.
		if ( 0 === window.location.pathname.indexOf( opts[ i ].value ) ) {
			opts[ i ].setAttribute( 'selected', 'selected' );
		}
	}
} )();
</script>
