Random Name Generator

RPG Name Generator (silly)

by Panomosh

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="site-wrapper">
    <div class="site-wrapper-inner">
        <div class="cover-container">
            <div class="masthead clearfix">
                <div class="inner">
                     <h3 class="masthead-brand">Random Name Generator!</h3>

                </div>
            </div>
            <div class="inner cover">
                <p>You are...</p>
                <blockquote class="nameTag"></blockquote>
                <p class="lead"> <a href="#" class="btn btn-lg btn-default" id="go">Again!</a>

                </p>
            </div>
        </div>
    </div>
</div>

CSS

/*
 * Globals
 */

/* Links */
 a, a:focus, a:hover {
    color: #fff;
}
/* Custom default button */
 .btn-default, .btn-default:focus {
    color: #333;
    text-shadow: none;
    /* Prevent inheritence from `body` */
    background-color: #fff;
    border: 1px solid #fff;
    transition:all 0.1s;
    box-shadow: 0 8px 10px -20px #80ff00;
}
.btn-default:hover {
    color:#000;
}
/*
 * Base structure
 */
 .quoteFooter {
    font-size: 0.8em;
    color:#eee;
}
.quoteFooter:before {
    content:"- ";
    font-size: 20px;
    margin:0;
    padding:0;
    text-shadow: none;
}
html, body {
    height: 100%;
    background-color:#333;
}
body {
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 3px #000;
    box-shadow: inset 0 0 300px #000;
}
/* Extra markup and styles for table-esque vertical and horizontal centering */
 .site-wrapper {
    display: table;
    width: 100%;
    height: 100%;
    /* For at least Firefox */
    min-height: 100%;
}
.site-wrapper-inner {
    display: table-cell;
    vertical-align: top;
}
.cover-container {
    margin-right: auto;
    margin-left: auto;
}
/* Padding for spacing */
 .inner {
    padding: 30px;
}
/*
 * Header
 */
 .masthead-brand {
    margin-top: 10px;
    margin-bottom: 10px;
}
.masthead-nav > li {
    display: inline-block;
}
.masthead-nav > li + li {
    margin-left: 20px;
}
.masthead-nav > li > a {
    padding-right: 0;
    padding-left: 0;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    /* IE8 proofing */
    color: rgba(255, 255, 255, .75);
    border-bottom: 2px solid transparent;
}
.masthead-nav > li > a:hover, .masthead-nav > li > a:focus {
    background-color: transparent;
    border-bottom-color: rgba(255, 255, 255, .25);
}
.masthead-nav > .active > a, .masthead-nav > .active > a:hover, .masthead-nav > .active > a:focus {
    color: #fff;
    border-bottom-color: #fff;
}
@media (min-width: 768px) {
    .masthead-brand {
        float: left;
    }
    .masthead-nav {
        float:...

JavaScript

$(function () {

    // BING IMAGE API 
    // https://api.datamarket.azure.com/Bing/Search/
    //
    
    var prefix = ["raging", "infected", "robotic", "benevolent", "fleshy", "malevolent", "Bionic", "strategic", "tactical", "fancy", "opulent", "wealthy", "heavy", "clumsy", "magnificent", "itchy", "deafening", "naked", "contained", "controlled", "inspiring", "awesome", "putrid", "calm", "meaty", "puny", "greasy", "growling", "unholy", "cold", "heated", "melting", "liquid", "hovering", "grounded", "lonely", "burning", "fumbling", "slippy", "time worn", "inflated", "downtrodden", "bubbling", "vegetarian", "splintering", "titanium", "moist", "understanding", "cautious", "falling", "growing", "shrinking", "choking", "spluttering", "tranquilized", "vomiting", "singing", "musical", "blinding", "bright", "crooked", "creaky", "echoing", "fallen", "fuzzy", "fluffy", "hairy", "important", "hollow", "uneven", "creepy", "crooked", "jilted", "wounding", "crackling", "jagged", "misty", "dirty", "only", "quick", "ragged", "rapid", "running", "sandy", "whistling", "sneaky", "inaudible", "shining", "soft", "swift", "truncated", "tall", "triangular", "thorny", "mute", "silent", "wretched", "caustic", "swollen", "painfull", "tumbling", "wild", "lonely", "incapacitated", "intoxicated", "prone", "lonely", "hidden", "once known", "blind", "transparent", "iron skinned", "floating", "pork", "smouldering", "freezing", "frozen", "listening", "black", "white", "opaque", "invisible", "pointless", "angry", "pale", "sunburnt", "bleeding", "wounded", "thoughtful", "poisoned", "vibrating", "shaking", "fumbling", "crawling", "chemical", "depressing", "sad", "happy", "fragile", "joyous", "shimmering", "deadly", "lethal", "slow", "steep", "guilty", "manic", "laughing", "cackling", "glowing", "unknown", "murderous", "never ending", "frowning", "sighing", "explosive", "naked", "lidless", "weeping", "inflamable", "incredible", "beautiful", "electric", "intrusive", "ignorant", "arogant",...