select

select.js

	/* Input type Select - kreirati neke JS funkcije za reuse
	======================= */
	var selects = document.getElementsByClassName('input__field--select');
	[].forEach.call(selects,function(select){
		var docFrag = document.createDocumentFragment(),
			mainNode = document.createElement('div'),
			span = document.createElement('span'),
			ul = document.createElement('ul');

	        mainNode.className = "gens-select";
	        ul.className = "gens-dropdown";
	        mainNode.appendChild(span);
	        mainNode.appendChild(ul);
	        select.parentNode.insertBefore(mainNode,null);

        for (let i = 0; i < select.length; i++) {
        	var node = document.createElement("li"),
				textnode = document.createTextNode(select[i].value);
			node.appendChild(textnode);
			node.setAttribute("data-value",select[i].value);
			node.addEventListener("click",clickEvent,false);
        	docFrag.appendChild(node);

        	if(i == 0) {
        		span.appendChild(document.createTextNode(select[i].value));
        	}
        };

        ul.appendChild(docFrag);
        span.addEventListener("click",toggleElements,false);

	});

	function clickEvent(e) {
		var el     = e.target,
			data   = el.getAttribute("data-value"),
			select = el.parentNode.parentNode.previousElementSibling;

		el.parentNode.previousSibling.innerHTML = data; //span
		select.value = data; // select option
		el.parentNode.style.display = el.parentNode.style.display == 'block' ? 'none' : 'block';
		// If needed selected selected
		/*
		for(var i=0; i < select.length; i++)
	    {
	      if(select.options[i].value == data)
	        select.selectedIndex = i;
	    }
	    */
	}

	function toggleElements(e) {
		e.target.nextElementSibling.style.display = e.target.nextElementSibling.style.display == 'block' ? 'none' : 'block';
	}