Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  
  <div id="maindiv">
  <h1 id="pagename">Soccer Seeker</h1>
</div><br/><br/>
<div id="menudiv">
  <img id="fbbanner" src="http://www.congareerapid.com/_uploads/57644b2fdfa3fe30f307d690/CollegeSoccerPic.jpg">
<ul id="menulist">
  <li><button id="btn1" class="btns">Home</button></li>
  <li><button id="btn2" class="btns">About</button></li>
  <li><button id="btn3" class="btns">Info</button></li>
  <li><button id="btn4" class="btns">Guide</button></li>
  <li><button id="btn5" class="btns">Use</button></li>
</ul>
</div><br/>
<div id="aboutdiv">
  <h1 id="aboutpara">What we're <b>about</b></h1>
  <ul id="aboutlist">
    <li class="ablist"><div class="abdiv"><img class="aboutimages" src="http://pluspng.com/img-png/png-stopwatch-stopwatch-emoji-512.png"><p class="abpara">Saving you time</p></div></li>
    <li class="ablist"><div class="abdiv"><img class="aboutimages" src="https://vignette.wikia.nocookie.net/clubpenguin/images/5/50/Emoticons_Glove_ROR_Monster_Takeover_2013.png/revision/latest?cb=20130627084423&format=original"><p class="abpara">Outputting quality results</p></div></li>
    <li class="ablist"><div class="abdiv"><img id="loneimg" class="aboutimages" src="https://images.vexels.com/media/users/3/141408/isolated/preview/c1ee598f7543570370636df538d899bc-vincent-kompany-cartoon-by-vexels.png"><p class="abpara">Presenting all choices</p></div></li>
  </ul>
</div>
<div id="infodiv">
  <h1 id="infopara"><b>What</b> exactly is Soccer Seeker?</h1>
  <ul id="infolist">
    <li class="ilist"><div class="idiv"><img class="infoimgs" src="https://cdn1.iconfinder.com/data/icons/electronics-12/64/pc_tower_gaming_custom_electronic_gadget_tech-128.png"><p class="ipg">Quick results machine</p></div></li>
    <li class="ilist"><div class="idiv"><img class="infoimgs" src="https://image.flaticon.com/icons/png/512/269/269090.png"><p class="ipg">Sports channel finder</p></div></li>
    <li class="ilist"><div class="idiv"><img class="infoimgs" src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-ios7-location-512.png"><p class="ipg">Location based provider</p></div></li>
  </ul>
  </div>
<div id="guidediv">
  <img id="guideimg" src="https://baltimoreceltic.com/wp-content/uploads/2017/05/soccer-banner.png">
  <div id="guidepara"><p id="gp">CHOOSE A LOCATION<br/><br/>BROWSE FOR SERVERS<br/><br/>ENJOY</p></div>
</div>
<div id="appdiv">
  <div id="smalrdiv">
  <ul id="locationlist">
    <li class="locitem">
      <p class="lcp">Europe</p>
      <select class="selected">
         <option value="greece">Greece</option>
         <option value="albania">Albania</option>
         <option value="montenegro">Montenegro</option>
         <option value="serbia">Serbia</option>
         <option value="croatia">Croatia</option>
         <option value="bosnia">Bosnia</option>
         <option value="kosovo">Kosovo</option>
         <option value="slovenia">Slovenia</option>
         <option value="italy">Italy</option>
         <option value="spain">Spain</option> 
         <option value="portugal">Portugal</option>
        <option value="france">France</option>
         <option value="belgium">Belgium</option>
         <option value="germany">Germany</option>
         <option value="">United Kingdom</option>
         <option value="switzerland">Switzerland</option>
         <option value="sweden">Sweden</option>
         <option value="iceland">Iceland</option>
         <option value="poland">Poland</option>
         <option value="netherlands">Netherlands</option>
         <option value="malta">Malta</option>
         <option value="ukraine">Ukraine</option>
         <option value="austria">Austria</option>
         <option value="denmark">Denmark</option>
         <option value="norway">Norway</option>
         <option value="czechrepublic">Czech Republic</option>
         <option value="hungary">Hungary</option>
         <option value="bulgaria">Bulgaria</option>
         <option value="romania">Romania</option>
         <option value="moldova">Moldova</option>
         <option value="finland">Finland</option>
         <option value="luxembourg">Luxembourg</option>
         <option value="ireland">Ireland</option>
         <option value="estonia">Estonia</option>
         <option value="lithuania">Lithuania</option>
         <option value="macedonia">Macedonia</option>
         <option value="slovakia">Slovakia</option>
         <option value="belarus">Belarus</option>
         <option value="latvia">Latvia</option>
         <option value="turkey">Turkey</option>
        <option value="russia">Russia</option>
</select>
    </li>
    <li class="locitem">
      <p class="lcp">Americas</p>
      <select class="selected">
        <option value="usa">USA</option>
        <option value="mexico">Mexico</option>
        <option value="Brazil">Brazil</option>
        <option value="argentina">Argentina</option>
        <option value="canada">Canada</option>
        <option value="colombia">Colombia</option>
        <option value="chile">Chile</option>
        <option value="bolivia">Bolivia</option>
        <option value="paraguay">Paraguay</option>
        <option value="peru">Peru</option>
        <option value="venezeula">Venezuela</option>
        <option value="ecuador">Ecuador</option>
        <option value="uruguay">Uruguay</option>
        <option value="guyana">Guyana</option>
        <option value="suriname">Suriname</option>
      </select>
    </li>
    <li class="locitem">
      <p class="lcp">Africa</p>
      <select class="selected">
        <option value="morocco">Morocco</option>
        <option value="southafrica">South Africa</option>
        <option value="nigeria">Nigeria</option>
        <option value="senegal">Senegal</option>
        <option value="algeria">Algeria</option>
        <option value="ethiopia">Ethiopia</option>
        <option value="tunisia">Tunisia</option>
        <option value="kenya">Kenya</option>
        <option value="mauritius">Mauritius</option>
        <option value="drc">Democratic Republic of the Congo</option>
        <option value="madagascar">Madagascar</option>
        <option value="tanzania">Tanzania</option>
        <option value="zimbabwe">Zimbabwe</option>
        <option value="ghana">Ghana</option>
        <option value="uganda">Uganda</option>
        <option value="mali">Mali</option>
        <option value="cameroon">Cameroon</option>
        <option value="libya">Libya</option>
        <option value="sudan">Sudan</option>
        <option value="cdl">Côte d’Ivoire</option>
        <option value="rwanda">Rwanda</option>
        <option value="namibia">Namibia</option>
        <option value="eritrea">Eritrea</option>
        <option value="malawi">Malawi</option>
        <option value="angola">Angola</option>
        <option value="mozambique">Mozambique</option>
        <option value="botswana">Botswana</option>
        <option value="guinea">Guinea</option>
        <option value="bf">Burkina Faso</option>
        <option value="zambia">Zambia</option>
        <option value="swaziland">Swaziland</option>
        <option value="mauritania">Mauritania</option>
        <option value="benin">Benin</option>
        <option value="djibouti">Djibouti</option>
        <option value="chad">Chad</option>
        <option value="gabon">Gabon</option>
        <option value="togo">Togo</option>
        <option value="niger">Niger</option>
        <option value="gambia">Gambia</option>
        <option value="liberia">Liberia</option>
        <option value="sl">Sierre Leone</option>
        <option value="burundi">Burundi</option>
        <option value="car">Central African Republic</option>
        <option value="lesetho">Lesetho</option>
        <option value="ss">South Sudan</option>
        <option value="congo">Congo</option>
        <option value="comoros">Comoros</option>
        <option value="réunion">Réunion</option>
      </select>
    </li>
    <li class="locitem">
      <p class="lcp">Middle East</p>
      <select class="selected">
        <option value="israel">Israel</option>
        <option value="syria">Syria</option>
        <option value="iran">Iran</option>
        <option value="saudiarabia">Saudi Arabia</option>
        <option value="iraq">Iraq</option>
        <option value="egypt">Egypt</option>
        <option value="uae">United Arab Emirates</option>
        <option value="lebanon">Lebanon</option>
        <option value="qatar">Qatar</option>
        <option value="sop">State of Palestine</option>
        <option value="jordan">Jordan</option>
        <option value="yemen">Yemen</option>
        <option value="bahrain">Bahrain</option>
        <option value="kuwait">Kuwait</option>
        <option value="oman">Oman</option>
        <option value="pakistan">Pakistan</option>
        <option value="afghanistan">Afghanistan</option>
        <option value="israel">Israel</option>
      </select>
    </li>
    <li class="locitem">
      <p class="lcp">Asia</p>
      <select class="selected">
        <option value="japan">Japan</option>
        <option value="india">India</option>
        <option value="china">China</option>
        <option value="thailand">Thailand</option>
        <option value="singapore">Singapore</option>
        <option value="indonesia">Indonesia</option>
        <option value="philippines">Philippines</option>
        <option value="sk">South Korea</option>
        <option value="maldives">Maldives</option>
        <option value="hk">Hong Kong</option>
        <option value="malaysia">Malaysia</option>
        <option value="bangladesh">Bangladesh</option>
        <option value="srilanka">Sri Lanka</option>
        <option value="myanmar">Myanmar</option>
        <option value="taiwan">Taiwan</option>
        <option value="cambodia">Cambodia</option>
        <option value="armenia">Armenia</option>
        <option value="macau">Macau</option>
        <option value="laos">Laos</option>
        <option value="lebanon">Lebanon</option>
        <option value="mongolia">Mongolia</option>
        <option value="uzbekistan">Uzbekistan</option>
        <option value="oman">Oman</option>
        <option value="bahrain">Bahrain</option>
        <option value="kyrgyzstan">Kyrgyzstan</option>
        <option value="brunei">Brunei</option>
        <option value="bhutan">Bhutan</option>
        <option value="turkmenistan">Turkmenistan</option>
        <option value="tajikistan">Tajikistan</option>
        <option value="tl">Timor-Leste</option>
      </select>
    </li>
    <li class="locitem">
      <p class="lcp">Oceania</p>
      <select class="selected">
      <option value="australia">Australia</option>
      <option value="nz">New Zealand</option>
      </select>
    </li>
    <li class="locitem">
      <p class="lcp">Russia</p>
      <select class="selected">
      <option value="russia">Russia</option>
      </select>
    </li>
  </ul>
  </div>
</div>
<div id="servicespage">
  <ul id="resultslist">
    <li>
      <ul class="listedservices">
        <li class="pe"><div id="resdiv1" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#1</a></div></li>
        <li class="pe"><div id="resdiv2" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#2</a></div></li>
        <li class="pe"><div id="resdiv3" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#3</a></div></li>
        <li class="pe"><div id="resdiv4" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#4</a></div></li>
      </ul>
    </li>
    <li>
      <ul class="listedservices">
        <li class="pe"><div id="resdiv5" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#5</a></div></li>
        <li class="pe"><div id="resdiv6" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#6</a></div></li>
        <li class="pe"><div id="resdiv7" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#7</a></div></li>
        <li class="pe"><div id="resdiv8" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#8</a></div></li>
      </ul>
    </li>
    <li>
      <ul class="listedservices">
        <li class="pe"><div id="resdiv9" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#9</a></div></li>
        <li class="pe"><div id="resdiv10" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#10</a></div></li>
        <li class="pe"><div id="resdiv11" class="resdiv"><a  class="links" href="">Recommended<br/>Service<br/>#11</a></div></li>
        <li class="pe"><div id="resdiv12" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#12</a></div></li>
      </ul>
    </li>
    <li>
      <ul class="listedservices">
        <li class="pe"><div id="resdiv13" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#13</a></div></li>
        <li class="pe"><div id="resdiv14" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#14</a></div></li>
        <li class="pe"><div id="resdiv15" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#15</a></div></li>
        <li class="pe"><div id="resdiv16" class="resdiv"><a class="links" href="">Recommended<br/>Service<br/>#16</a></div></li>
      </ul>
    </li>
  </ul>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
</div>
​
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers