function calcsum() {
console.log("Begin calculation");

    var resultsoutput = document.getElementById("resultsoutput");

	//var arr = document.getElementsByName('s');
    var arr = document.getElementsByClassName('sval');
	var sum = 0;
	for(var i=0;i<arr.length;i++) {
	
	if(arr[i].checked && arr[i].type == "radio") {
		sum+=parseInt(arr[i].value);					  
	} else if(arr[i].type == "select") {				  
		sum+=parseInt(arr[i].value);
	}
								  
	}

    var results = document.getElementsByClassName('results');
	for(var i=0;i<results.length;i++) {
		
        var sumid = results[i].getAttribute('data-sum'); 
console.log("Sumid:"+sumid);
console.log("sum:"+sum);
        if(sum <= sumid) {
            console.log(results[i].innerHTML);
            resultsoutput.innerHTML = results[i].innerHTML;
            return;
        }
        

	}

}


var html = `
<div id="wcioberegner"><div class="inputWrapper"><h3>Har du i det seneste år oplevet at ende med at drikke mere eller længere, end du havde tænkt dig?</h3><input type="radio" value="" style="display:none;" class="sval" name="0"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="0"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="0"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år mere end én gang ønsket eller prøvet at skære ned eller stoppe med at drikke, men ikke kunnet det?</h3><input type="radio" value="" style="display:none;" class="sval" name="1"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="1"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="1"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år brugt meget tid på at drikke? Eller brugt meget tid på at være syg eller komme dig over andre følgevirkninger?</h3><input type="radio" value="" style="display:none;" class="sval" name="2"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="2"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="2"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år så gerne villet have en drink, at du ikke kunne tænke på andet?</h3><input type="radio" value="" style="display:none;" class="sval" name="3"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="3"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="3"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år oplevet at det at drikke - eller at være syg af at drikke - ofte forstyrrede at tage dig af hjemlige pligter eller din familie? Eller forårsagede arbejdsproblemer? Eller skoleproblemer?</h3><input type="radio" value="" style="display:none;" class="sval" name="4"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="4"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="4"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år fortsat med at drikke, selvom det skabte problemer med din familie eller venner?</h3><input type="radio" value="" style="display:none;" class="sval" name="5"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="5"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="5"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år opgivet eller skåret ned på aktiviteter, der var vigtige eller interessante for dig, eller gav dig glæde, for i stedet at drikke?</h3><input type="radio" value="" style="display:none;" class="sval" name="6"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="6"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="6"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år mere end én gang endt i situationer, mens eller efter at have drukket, der øgede risikoen for at komme til skade (såsom at køre bil, svømme, bruge maskiner, gå i et farligt område eller have usikker sex)?</h3><input type="radio" value="" style="display:none;" class="sval" name="7"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="7"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="7"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år fortsat med at drikke, selvom det fik dig til at føle dig deprimeret eller angst eller tilføjede et andet sundhedsproblem? Eller efter at have haft et hukommelsesblackout?</h3><input type="radio" value="" style="display:none;" class="sval" name="8"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="8"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="8"> Nej</div></div><div class="inputWrapper"><h3> Har du det seneste år, været nødt til at drikke meget mere, end du engang gjorde for at få den ønskede effekt? Eller oplevede at dit sædvanlige antal genstande havde meget mindre effekt end før?</h3><input type="radio" value="" style="display:none;" class="sval" name="9"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="9"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="9"> Nej</div></div><div class="inputWrapper"><h3>Har du i det seneste år oplevet at når virkningerne af alkohol var ved at aftage, havde du abstinenssymptomer, såsom søvnbesvær, rysten, rastløshed, kvalme, svedtendens, hjertebanken eller anfald? Eller fornemmet ting, der ikke var der?</h3><input type="radio" value="" style="display:none;" class="sval" name="10"><div class="svalwrapper"><input type="radio" value="1" class="sval" name="10"> Ja</div><div class="svalwrapper"><input type="radio" value="0" class="sval" name="10"> Nej</div></div><div class="inputWrapper"><span onclick="calcsum()" class="wcioBregenerButton"><center>Få en vurdering af dit alkholforbrug baseret på de besvarede spørgsmål</center></span></div></div><div class="results" data-sum="1" style="display:none;"><b>Svarene tyder ikke på du har noget misbrugsproblem</b><br>Det er rigtig godt! <br></div><div class="results" data-sum="3" style="display:none;"><b>Svarene indikerer en mild afhængighed</b><br>Svarene indikerer der er vilkår, som er behandlingskrævende og vi råder dig til at søge professionel hjælp.  <br>Kontakt os gerne via nedenstående kontaktinfo for en anonym og uforpligtende forsamtale. <br></div><div class="results" data-sum="5" style="display:none;"><b>Svarene indikerer en moderat afhængighed</b><br>Svarene indikerer der er et skadeligt forbrug, som er behandlingskrævende og vi anbefaler at du får professionel hjælp gennem misbrugsbehandling.  <br>Kontakt os gerne via nedenstående kontaktinfo for en anonym og uforpligtende forsamtale.<br></div><div class="results" data-sum="99" style="display:none;"><b>Svarene indikerer en svær grad af afhængighed</b><br>Svarene indikerer der er et skadeligt forbrug, som er behandlingskrævende og vi anbefaler at du får akut professionel hjælp gennem misbrugsbehandling.  <br>Kontakt os gerne via nedenstående kontaktinfo for en anonym og uforpligtende forsamtale.<br></div><div id="resultsoutput"></div><style>
#wcioScriptContainer { margin-bottom:30px; }
#wcioberegner select { margin-bottom:30px; border:0px; }
#wcioberegner h3 { margin:0px; }
.svalwrapper {
    background-color: #6c9900eb;
    box-shadow: 0 0.15em 0.125em rgb(175 175 175 / 25%);
    margin: 12px 0;
    cursor: pointer;
    padding: 8px 0 8px 8px;
    border-radius: 6px;
    color: #ffff;
	position: relative;
}
div#wcioberegner {
    background: #f3f3f3;
    padding: 20px;
    border-radius: 5px;
}
input[type=radio].sval {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    cursor: pointer;
}
.wcioBregenerButton, .wcioBregenerButton:hover, .wcioBregenerButton:active {
    background: #6c9900eb !important;
    border: 1px solid #3a5101eb !important;
    color: #fff !important;
	margin: 40px auto 0px auto;
    display: block;
	padding: 6px;
}
div#resultsoutput {
    background: #f3f3f3;
    text-align: center;
    font-size: 16px !important;
    padding-bottom: 30px;
}
</style>

<style>#wcioScriptContainer .inputWrapper {display:none;} #wcioScriptContainer .inputWrapper:first-of-type {display:block;} </style>`;

var container = document.getElementById("wcioScriptContainer");
var content = document.createElement("div");
content.innerHTML = html;
container.appendChild(content);
                       
     jQuery(function($) {
           
      $('#wcioScriptContainer select').on('change', function() {
                     $(this).parent().parent().toggle();
                     $(this).parent().parent().next(".inputWrapper").fadeIn();
                     
      });
					   
	 $('#wcioScriptContainer input[type=radio]').on('change', function() {
                     $(this).parent().parent().toggle();
                     $(this).parent().parent().next(".inputWrapper").fadeIn();
                     
      });
	
					   	 $('#wcioScriptContainer .wcioBregenerButton').on('click', function() {
					   		$(this).toggle(); 
					   });
					   
                       
});       

