prank

by arcm111

HTML

<body>
    <div id="questions">
        
        <h1 align="center">Future soul mate prediction</h1>     
        <h3>please answer the following questions honestly and this software will find the best matching guy/girl for your personality:</h3>

        <p>please choose your gender</p>
        <input type="radio" id=n ame="group1" />Male
        <br/>
        <input type="radio" class="female" name="group1" />Female
        <br/>
        <br/>
        <p>How old are you</p>
        <input type="radio" name="group2" />18-30
        <br/>
        <input type="radio" name="group2" />30+
        <br/>
        <br/>
        <p>what's your favouite colour</p>
        <input type="radio" name="group3" />Red
        <br/>
        <input type="radio" name="group3" />Blue
        <br/>
        <input type="radio" name="group3" />Green
        <br/>
        <br/>
        <p>Which of the following activities do you enjoy the most</p>
        <input type="radio" name="group4" />Sports
        <br/>
        <input type="radio" name="group4" />Reading
        <br/>
        <input type="radio" name="group4" />Meeting friends
        <br/>
        <br/>
        <button id="btn">Find my Dream Girl/Guy</button>
    </div>
    <div id="results" style="display: none" >
        <h1 id="title" align="center"></h1>
    </div>
</body>

CSS

body {
    font-family: arial
}

JavaScript

document.getElementById("btn").onclick = function () {
    var rgs = document.getElementsByTagName("input"),
        total = 0,
        gender = "m";
    var title = document.getElementById("title");
    var ques = document.getElementById("questions");
    var result = document.getElementById("results");
    for (var i = 0; i < rgs.length; i++)
    {
        if (rgs[i].checked) total++;
        if (rgs[i].className == "female" && rgs[i].checked) gender = "f";
    }
    
    if (total == 4)
    {
        var img = document.createElement("img");
        img.src = (gender == "f") ? "http://1.bp.blogspot.com/-4nb93VkFBu8/UgitFKfgOmI/AAAAAAAAOQU/8bSiaDaVE0w/s1600/nerd.jpg" : "https://pbs.twimg.com/profile_images/378800000404032505/471535f83e0c956839cb836cea92acd7.jpeg";
        title.innerHTML = "Your Dream " + ((gender == "m") ? "girl" : "guy");
        ques.style.display = "none";
        result.style.display = "block";
        result.appendChild(img);
        document.body.scrollTop = 0;
    }
    else
        alert("please answer all questions first");
}