I cannot make a running list with the following JavaScript code












0















With following code, I can append a list that is reading data from the form. But I suppose to make running list, so that if I change any input, on click, another list is created with updated information. My appended information is just a single list instead. How can a make a list of appended profile with every update. Please help!






<!DOCTYPE html>

<html>



<head>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384- 

          BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

  <title>Employee Profile</title>

</head>



<body>

  <div class="container">

    <div class="col-xs-6">

      <form>

        <div class="form-group">

          <label for="name">Full Name *</label>

          <input type="text" class="form-control" id="name" placeholder="Full Name" required>

        </div>

        <div class="form-group">

          <label for="headline">Headline *</label>

          <input type="text" class="form-control" id="headline" placeholder="Headline" required>

        </div>

        <div class="form-group">

          <label for="position">Current Position</label>

          <input type="text" class="form-control" id="position" placeholder="Current Position">

        </div>

        <div class="form-group">

          <label for="spRegion">State/Province/Region * 

                </label>

          <select class="form-control" id="spRegion" required>

            <option>Please select</option>

            <option value="AL">Alabama</option>

            <option value="AK">Alaska</option>

            <option value="AZ">Arizona</option>

            <option value="AR">Arkansas</option>

            <option value="CA">California</option>

            <option value="CO">Colorado</option>

            <option value="CT">Connecticut</option>

            <option value="DE">Delaware</option>

            <option value="DC">District Of Columbia

            </option>

            <option value="FL">Florida</option>

            <option value="GA">Georgia</option>

            <option value="HI">Hawaii</option>

            <option value="ID">Idaho</option>

            <option value="IL">Illinois</option>

            <option value="IN">Indiana</option>

            <option value="IA">Iowa</option>

            <option value="KS">Kansas</option>

            <option value="KY">Kentucky</option>

            <option value="LA">Louisiana</option>

            <option value="ME">Maine</option>

            <option value="MD">Maryland</option>

            <option value="MA">Massachusetts</option>

            <option value="MI">Michigan</option>

            <option value="MN">Minnesota</option>

            <option value="MS">Mississippi</option>

            <option value="MO">Missouri</option>

            <option value="MT">Montana</option>

            <option value="NE">Nebraska</option>

            <option value="NV">Nevada</option>

            <option value="NH">New Hampshire</option>

            <option value="NJ">New Jersey</option>

            <option value="NM">New Mexico</option>

            <option value="NY">New York</option>

            <option value="NC">North Carolina</option>

            <option value="ND">North Dakota</option>

            <option value="OH">Ohio</option>

            <option value="OK">Oklahoma</option>

            <option value="OR">Oregon</option>

            <option value="PA">Pennsylvania</option>

            <option value="RI">Rhode Island</option>

            <option value="SC">South Carolina</option>

            <option value="SD">South Dakota</option>

            <option value="TN">Tennessee</option>

            <option value="TX">Texas</option>

            <option value="UT">Utah</option>

            <option value="VT">Vermont</option>

            <option value="VA">Virginia</option>

            <option value="WA">Washington</option>

            <option value="WV">West Virginia</option>

            <option value="WI">Wisconsin</option>

            <option value="WY">Wyoming</option>

          </select>

        </div>

        <div class="form-group">

          <label for="country">Country * </label>

          <select class="form-control" id="country" required>

            <option>Please select</option>

            <option value="AF">Afghanistan</option>

            <option value="AX">Åland Islands</option>

            <option value="AL">Albania</option>

            <option value="DZ">Algeria</option>

            <option value="AS">American Samoa</option>

            <option value="AD">Andorra</option>

            <option value="AO">Angola</option>

            <option value="AI">Anguilla</option>

            <option value="AQ">Antarctica</option>

            <option value="AG">Antigua and Barbuda

            </option>

            <option value="AR">Argentina</option>

            <option value="AM">Armenia</option>

            <option value="AW">Aruba</option>

            <option value="AU">Australia</option>

            <option value="AT">Austria</option>

            <option value="AZ">Azerbaijan</option>

            <option value="BS">Bahamas</option>

            <option value="BH">Bahrain</option>

            <option value="BD">Bangladesh</option>

            <option value="BB">Barbados</option>

            <option value="BY">Belarus</option>

            <option value="BE">Belgium</option>

            <option value="BZ">Belize</option>

            <option value="BJ">Benin</option>

            <option value="BM">Bermuda</option>

            <option value="BT">Bhutan</option>

            <option value="BO">Bolivia, Plurinational State of

            </option>

            <option value="BQ">Bonaire, Sint Eustatius and Saba

            </option>

            <option value="BA">Bosnia and Herzegovina

            </option>

            <option value="BW">Botswana</option>

            <option value="BV">Bouvet Island</option>

            <option value="BR">Brazil</option>

            <option value="IO">British Indian Ocean Territory

            </option>

            <option value="BN">Brunei Darussalam

            </option>

            <option value="BG">Bulgaria</option>

            <option value="BF">Burkina Faso</option>

            <option value="BI">Burundi</option>

            <option value="KH">Cambodia</option>

            <option value="CM">Cameroon</option>

            <option value="CA">Canada</option>

            <option value="CV">Cape Verde</option>

            <option value="KY">Cayman Islands

            </option>

            <option value="CF">Central African Republic

            </option>

            <option value="TD">Chad</option>

            <option value="CL">Chile</option>

            <option value="CN">China</option>

            <option value="CX">Christmas Island

            </option>

            <option value="CC">Cocos (Keeling) Islands

            </option>

            <option value="CO">Colombia</option>

            <option value="KM">Comoros</option>

            <option value="CG">Congo</option>

            <option value="CD">Congo, the Democratic Republic of the

            </option>

            <option value="CK">Cook Islands</option>

            <option value="CR">Costa Rica</option>

            <option value="CI">Côte d'Ivoire</option>

            <option value="HR">Croatia</option>

            <option value="CU">Cuba</option>

            <option value="CW">Curaçao</option>

            <option value="CY">Cyprus</option>

            <option value="CZ">Czech Republic

            </option>

            <option value="DK">Denmark</option>

            <option value="DJ">Djibouti</option>

            <option value="DM">Dominica</option>

            <option value="DO">Dominican Republic

            </option>

            <option value="EC">Ecuador</option>

            <option value="EG">Egypt</option>

            <option value="SV">El Salvador</option>

            <option value="GQ">Equatorial Guinea

            </option>

            <option value="ER">Eritrea</option>

            <option value="EE">Estonia</option>

            <option value="ET">Ethiopia</option>

            <option value="FK">Falkland Islands (Malvinas)

            </option>

            <option value="FO">Faroe Islands

            </option>

            <option value="FJ">Fiji</option>

            <option value="FI">Finland</option>

            <option value="FR">France</option>

            <option value="GF">French Guiana

            </option>

            <option value="PF">French Polynesia

            </option>

            <option value="TF">French Southern Territories

            </option>

            <option value="GA">Gabon</option>

            <option value="GM">Gambia</option>

            <option value="GE">Georgia</option>

            <option value="DE">Germany</option>

            <option value="GH">Ghana</option>

            <option value="GI">Gibraltar</option>

            <option value="GR">Greece</option>

            <option value="GL">Greenland</option>

            <option value="GD">Grenada</option>

            <option value="GP">Guadeloupe</option>

            <option value="GU">Guam</option>

            <option value="GT">Guatemala</option>

            <option value="GG">Guernsey</option>

            <option value="GN">Guinea</option>

            <option value="GW">Guinea- Bissau

            </option>

            <option value="GY">Guyana</option>

            <option value="HT">Haiti</option>

            <option value="HM">Heard Island and McDonald Islands

            </option>

            <option value="VA">Holy See (Vatican City State)

            </option>

            <option value="HN">Honduras</option>

            <option value="HK">Hong Kong</option>

            <option value="HU">Hungary</option>

            <option value="IS">Iceland</option>

            <option value="IN">India</option>

            <option value="ID">Indonesia</option>

            <option value="IR">Iran, Islamic Republic of

            </option>

            <option value="IQ">Iraq</option>

            <option value="IE">Ireland</option>

            <option value="IM">Isle of Man</option>

            <option value="IL">Israel</option>

            <option value="IT">Italy</option>

            <option value="JM">Jamaica</option>

            <option value="JP">Japan</option>

            <option value="JE">Jersey</option>

            <option value="JO">Jordan</option>

            <option value="KZ">Kazakhstan</option>

            <option value="KE">Kenya</option>

            <option value="KI">Kiribati</option>

            <option value="KP">Korea, Democratic People's Republic of

            </option>

            <option value="KR">Korea, Republic of

            </option>

            <option value="KW">Kuwait</option>

            <option value="KG">Kyrgyzstan</option>

            <option value="LA">Lao People's Democratic Republic

            </option>

            <option value="LV">Latvia</option>

            <option value="LB">Lebanon</option>

            <option value="LS">Lesotho</option>

            <option value="LR">Liberia</option>

            <option value="LY">Libya</option>

            <option value="LI">Liechtenstein</option>

            <option value="LT">Lithuania</option>

            <option value="LU">Luxembourg</option>

            <option value="MO">Macao</option>

            <option value="MK">Macedonia, the former Yugoslav Republic of

            </option>

            <option value="MG">Madagascar</option>

            <option value="MW">Malawi</option>

            <option value="MY">Malaysia</option>

            <option value="MV">Maldives</option>

            <option value="ML">Mali</option>

            <option value="MT">Malta</option>

            <option value="MH">Marshall Islands

            </option>

            <option value="MQ">Martinique</option>

            <option value="MR">Mauritania</option>

            <option value="MU">Mauritius</option>

            <option value="YT">Mayotte</option>

            <option value="MX">Mexico</option>

            <option value="FM">Micronesia, Federated States of

            </option>

            <option value="MD">Moldova, Republic of

            </option>

            <option value="MC">Monaco</option>

            <option value="MN">Mongolia</option>

            <option value="ME">Montenegro</option>

            <option value="MS">Montserrat</option>

            <option value="MA">Morocco</option>

            <option value="MZ">Mozambique</option>

            <option value="MM">Myanmar</option>

            <option value="NA">Namibia</option>

            <option value="NR">Nauru</option>

            <option value="NP">Nepal</option>

            <option value="NL">Netherlands</option>

            <option value="NC">New Caledonia

            </option>

            <option value="NZ">New Zealand</option>

            <option value="NI">Nicaragua</option>

            <option value="NE">Niger</option>

            <option value="NG">Nigeria</option>

            <option value="NU">Niue</option>

            <option value="NF">Norfolk Island

            </option>

            <option value="MP">Northern Mariana Islands

            </option>

            <option value="NO">Norway</option>

            <option value="OM">Oman</option>

            <option value="PK">Pakistan</option>

            <option value="PW">Palau</option>

            <option value="PS">Palestinian Territory, Occupied

            </option>

            <option value="PA">Panama</option>

            <option value="PG">Papua New Guinea

            </option>

            <option value="PY">Paraguay</option>

            <option value="PE">Peru</option>

            <option value="PH">Philippines</option>

            <option value="PN">Pitcairn</option>

            <option value="PL">Poland</option>

            <option value="PT">Portugal</option>

            <option value="PR">Puerto Rico</option>

            <option value="QA">Qatar</option>

            <option value="RE">Réunion</option>

            <option value="RO">Romania</option>

            <option value="RU">Russian Federation

            </option>

            <option value="RW">Rwanda</option>

            <option value="BL">Saint Barthélemy

            </option>

            <option value="SH">Saint Helena, Ascension and Tristan da Cunha

            </option>

            <option value="KN">Saint Kitts and Nevis

            </option>

            <option value="LC">Saint Lucia</option>

            <option value="MF">Saint Martin (French part)

            </option>

            <option value="PM">Saint Pierre and Miquelon

            </option>

            <option value="VC">Saint Vincent and the Grenadines

            </option>

            <option value="WS">Samoa</option>

            <option value="SM">San Marino</option>

            <option value="ST">Sao Tome and Principe

            </option>

            <option value="SA">Saudi Arabia

            </option>

            <option value="SN">Senegal</option>

            <option value="RS">Serbia</option>

            <option value="SC">Seychelles</option>

            <option value="SL">Sierra Leone

            </option>

            <option value="SG">Singapore</option>

            <option value="SX">Sint Maarten (Dutch part)

            </option>

            <option value="SK">Slovakia</option>

            <option value="SI">Slovenia</option>

            <option value="SB">Solomon Islands

            </option>

            <option value="SO">Somalia</option>

            <option value="ZA">South Africa

            </option>

            <option value="GS">South Georgia and the South Sandwich Islands

            </option>

            <option value="SS">South Sudan</option>

            <option value="ES">Spain</option>

            <option value="LK">Sri Lanka</option>

            <option value="SD">Sudan</option>

            <option value="SR">Suriname</option>

            <option value="SJ">Svalbard and Jan Mayen

            </option>

            <option value="SZ">Swaziland</option>

            <option value="SE">Sweden</option>

            <option value="CH">Switzerland</option>

            <option value="SY">Syrian Arab Republic

            </option>

            <option value="TW">Taiwan, Province of China

            </option>

            <option value="TJ">Tajikistan</option>

            <option value="TZ">Tanzania, United Republic of

            </option>

            <option value="TH">Thailand</option>

            <option value="TL">Timor-Leste</option>

            <option value="TG">Togo</option>

            <option value="TK">Tokelau</option>

            <option value="TO">Tonga</option>

            <option value="TT">Trinidad and Tobago

            </option>

            <option value="TN">Tunisia</option>

            <option value="TR">Turkey</option>

            <option value="TM">Turkmenistan</option>

            <option value="TC">Turks and Caicos Islands

            </option>

            <option value="TV">Tuvalu</option>

            <option value="UG">Uganda</option>

            <option value="UA">Ukraine</option>

            <option value="AE">United Arab Emirates

            </option>

            <option value="GB">United Kingdom

            </option>

            <option value="US">United States

            </option>

            <option value="UM">United States Minor Outlying Islands

            </option>

            <option value="UY">Uruguay</option>

            <option value="UZ">Uzbekistan</option>

            <option value="VU">Vanuatu</option>

            <option value="VE">Venezuela, Bolivarian Republic of

            </option>

            <option value="VN">Viet Nam</option>

            <option value="VG">Virgin Islands, British

            </option>

            <option value="VI">Virgin Islands, U.S.

            </option>

            <option value="WF">Wallis and Futuna

            </option>

            <option value="EH">Western Sahara

            </option>

            <option value="YE">Yemen</option>

            <option value="ZM">Zambia</option>

            <option value="ZW">Zimbabwe</option>

          </select>

        </div>

        <div class="form-group">

          <label for="education">Education</label>

          <input type="text" class="form-control" id="education" placeholder="Education">

        </div>

        <div class="form-group">

          <label for="skills">Skills</label>

          <input type="text" class="form-control" id="skills" placeholder="Skills">

        </div>

        <div class="form-group">

          <label for="linkedIn">My LinkedIn URL</label>

          <input type="text" class="form-control" id="linkedIn" placeholder="Your Link to Linked In">

        </div>

        <button type="submit" class="btn btn-primary">Create a Job 

              Profile</button>

        <!-- <button type="button" class="btn btn- 

                danger">Cancel</button> -->

      </form>

    </div>

  </div>

  <div class="col-xs-12">

    <div class="well">

      <div id="output">

        <!-- form input goes here -->

      </div>

      <!--  <button type="button" class="btn btn- 

              danger">Cancel</button> -->

    </div>

    <button type="button" class="btn btn-danger">Delete</button>

  </div>

  </div>

  <!-- </div> -->

  <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>

  <script src="http://sabioapi2.azurewebsites.net/scripts/sabio.js">

  </script>

  <script type="text/javascript">

    sabio.page.startUp = function() {



      $('button[type="submit"]').on('click', sabio.page.handlers.writeHtml);





      $('button.btn-danger').on('click', sabio.page.hideCar);

    };

    sabio.page.handlers.writeHtml = function(event) {

      event.preventDefault();

      // $('#output').show();

      var name = $('#name').val();

      var headline = $('#headline').val();

      var position = $('#position').val();

      var spRegion = $('#spRegion').val();

      var country = $('#country').val();

      var education = $('#education').val();

      var skills = $('#skills').val();

      var linkedIn = $('#linkedIn').val();



      $('#output').html(

        '<ul style="list-style: none;">' +

        '<li>' + name + '</li>' +

        '<li> Headline:' + headline + '</li>' +

        '<li> Current Position:' + position + '</li>' +

        '<li> Location' + spRegion + '</li>' +

        '<li> Country' + country + '</li>' +

        '<li> Education:' + education + '</li>' +

        '<li> Skills:' + skills + '</li>' +

        '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +

        '</ul>');

      // $('#output').append('<div><span>make:' +name+

      //                '</span></div><div><span>Headline: ' +headline+

      //                '</span></div><div><span>Current Position: ' +position+

      //                '</span></div><div><span>Location: ' +spRegion+

      //                '</span></div><div><span>Country: ' +country+

      //                '</span></div><div><span>Education: ' +edcation+

      //                '</span></div><div><span>Skills: ' +skills+

      //                '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'

      //                );

      $('form')[0].reset();

    };

    sabio.page.hideCar = function() {

      $('#output').hide();

    };

  </script>

</body>



</html>








javascript







share|improve this question





























    0















    With following code, I can append a list that is reading data from the form. But I suppose to make running list, so that if I change any input, on click, another list is created with updated information. My appended information is just a single list instead. How can a make a list of appended profile with every update. Please help!






    <!DOCTYPE html>
    
<html>
    

    
<head>
    
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384- 
    
          BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    
  <title>Employee Profile</title>
    
</head>
    

    
<body>
    
  <div class="container">
    
    <div class="col-xs-6">
    
      <form>
    
        <div class="form-group">
    
          <label for="name">Full Name *</label>
    
          <input type="text" class="form-control" id="name" placeholder="Full Name" required>
    
        </div>
    
        <div class="form-group">
    
          <label for="headline">Headline *</label>
    
          <input type="text" class="form-control" id="headline" placeholder="Headline" required>
    
        </div>
    
        <div class="form-group">
    
          <label for="position">Current Position</label>
    
          <input type="text" class="form-control" id="position" placeholder="Current Position">
    
        </div>
    
        <div class="form-group">
    
          <label for="spRegion">State/Province/Region * 
    
                </label>
    
          <select class="form-control" id="spRegion" required>
    
            <option>Please select</option>
    
            <option value="AL">Alabama</option>
    
            <option value="AK">Alaska</option>
    
            <option value="AZ">Arizona</option>
    
            <option value="AR">Arkansas</option>
    
            <option value="CA">California</option>
    
            <option value="CO">Colorado</option>
    
            <option value="CT">Connecticut</option>
    
            <option value="DE">Delaware</option>
    
            <option value="DC">District Of Columbia
    
            </option>
    
            <option value="FL">Florida</option>
    
            <option value="GA">Georgia</option>
    
            <option value="HI">Hawaii</option>
    
            <option value="ID">Idaho</option>
    
            <option value="IL">Illinois</option>
    
            <option value="IN">Indiana</option>
    
            <option value="IA">Iowa</option>
    
            <option value="KS">Kansas</option>
    
            <option value="KY">Kentucky</option>
    
            <option value="LA">Louisiana</option>
    
            <option value="ME">Maine</option>
    
            <option value="MD">Maryland</option>
    
            <option value="MA">Massachusetts</option>
    
            <option value="MI">Michigan</option>
    
            <option value="MN">Minnesota</option>
    
            <option value="MS">Mississippi</option>
    
            <option value="MO">Missouri</option>
    
            <option value="MT">Montana</option>
    
            <option value="NE">Nebraska</option>
    
            <option value="NV">Nevada</option>
    
            <option value="NH">New Hampshire</option>
    
            <option value="NJ">New Jersey</option>
    
            <option value="NM">New Mexico</option>
    
            <option value="NY">New York</option>
    
            <option value="NC">North Carolina</option>
    
            <option value="ND">North Dakota</option>
    
            <option value="OH">Ohio</option>
    
            <option value="OK">Oklahoma</option>
    
            <option value="OR">Oregon</option>
    
            <option value="PA">Pennsylvania</option>
    
            <option value="RI">Rhode Island</option>
    
            <option value="SC">South Carolina</option>
    
            <option value="SD">South Dakota</option>
    
            <option value="TN">Tennessee</option>
    
            <option value="TX">Texas</option>
    
            <option value="UT">Utah</option>
    
            <option value="VT">Vermont</option>
    
            <option value="VA">Virginia</option>
    
            <option value="WA">Washington</option>
    
            <option value="WV">West Virginia</option>
    
            <option value="WI">Wisconsin</option>
    
            <option value="WY">Wyoming</option>
    
          </select>
    
        </div>
    
        <div class="form-group">
    
          <label for="country">Country * </label>
    
          <select class="form-control" id="country" required>
    
            <option>Please select</option>
    
            <option value="AF">Afghanistan</option>
    
            <option value="AX">Åland Islands</option>
    
            <option value="AL">Albania</option>
    
            <option value="DZ">Algeria</option>
    
            <option value="AS">American Samoa</option>
    
            <option value="AD">Andorra</option>
    
            <option value="AO">Angola</option>
    
            <option value="AI">Anguilla</option>
    
            <option value="AQ">Antarctica</option>
    
            <option value="AG">Antigua and Barbuda
    
            </option>
    
            <option value="AR">Argentina</option>
    
            <option value="AM">Armenia</option>
    
            <option value="AW">Aruba</option>
    
            <option value="AU">Australia</option>
    
            <option value="AT">Austria</option>
    
            <option value="AZ">Azerbaijan</option>
    
            <option value="BS">Bahamas</option>
    
            <option value="BH">Bahrain</option>
    
            <option value="BD">Bangladesh</option>
    
            <option value="BB">Barbados</option>
    
            <option value="BY">Belarus</option>
    
            <option value="BE">Belgium</option>
    
            <option value="BZ">Belize</option>
    
            <option value="BJ">Benin</option>
    
            <option value="BM">Bermuda</option>
    
            <option value="BT">Bhutan</option>
    
            <option value="BO">Bolivia, Plurinational State of
    
            </option>
    
            <option value="BQ">Bonaire, Sint Eustatius and Saba
    
            </option>
    
            <option value="BA">Bosnia and Herzegovina
    
            </option>
    
            <option value="BW">Botswana</option>
    
            <option value="BV">Bouvet Island</option>
    
            <option value="BR">Brazil</option>
    
            <option value="IO">British Indian Ocean Territory
    
            </option>
    
            <option value="BN">Brunei Darussalam
    
            </option>
    
            <option value="BG">Bulgaria</option>
    
            <option value="BF">Burkina Faso</option>
    
            <option value="BI">Burundi</option>
    
            <option value="KH">Cambodia</option>
    
            <option value="CM">Cameroon</option>
    
            <option value="CA">Canada</option>
    
            <option value="CV">Cape Verde</option>
    
            <option value="KY">Cayman Islands
    
            </option>
    
            <option value="CF">Central African Republic
    
            </option>
    
            <option value="TD">Chad</option>
    
            <option value="CL">Chile</option>
    
            <option value="CN">China</option>
    
            <option value="CX">Christmas Island
    
            </option>
    
            <option value="CC">Cocos (Keeling) Islands
    
            </option>
    
            <option value="CO">Colombia</option>
    
            <option value="KM">Comoros</option>
    
            <option value="CG">Congo</option>
    
            <option value="CD">Congo, the Democratic Republic of the
    
            </option>
    
            <option value="CK">Cook Islands</option>
    
            <option value="CR">Costa Rica</option>
    
            <option value="CI">Côte d'Ivoire</option>
    
            <option value="HR">Croatia</option>
    
            <option value="CU">Cuba</option>
    
            <option value="CW">Curaçao</option>
    
            <option value="CY">Cyprus</option>
    
            <option value="CZ">Czech Republic
    
            </option>
    
            <option value="DK">Denmark</option>
    
            <option value="DJ">Djibouti</option>
    
            <option value="DM">Dominica</option>
    
            <option value="DO">Dominican Republic
    
            </option>
    
            <option value="EC">Ecuador</option>
    
            <option value="EG">Egypt</option>
    
            <option value="SV">El Salvador</option>
    
            <option value="GQ">Equatorial Guinea
    
            </option>
    
            <option value="ER">Eritrea</option>
    
            <option value="EE">Estonia</option>
    
            <option value="ET">Ethiopia</option>
    
            <option value="FK">Falkland Islands (Malvinas)
    
            </option>
    
            <option value="FO">Faroe Islands
    
            </option>
    
            <option value="FJ">Fiji</option>
    
            <option value="FI">Finland</option>
    
            <option value="FR">France</option>
    
            <option value="GF">French Guiana
    
            </option>
    
            <option value="PF">French Polynesia
    
            </option>
    
            <option value="TF">French Southern Territories
    
            </option>
    
            <option value="GA">Gabon</option>
    
            <option value="GM">Gambia</option>
    
            <option value="GE">Georgia</option>
    
            <option value="DE">Germany</option>
    
            <option value="GH">Ghana</option>
    
            <option value="GI">Gibraltar</option>
    
            <option value="GR">Greece</option>
    
            <option value="GL">Greenland</option>
    
            <option value="GD">Grenada</option>
    
            <option value="GP">Guadeloupe</option>
    
            <option value="GU">Guam</option>
    
            <option value="GT">Guatemala</option>
    
            <option value="GG">Guernsey</option>
    
            <option value="GN">Guinea</option>
    
            <option value="GW">Guinea- Bissau
    
            </option>
    
            <option value="GY">Guyana</option>
    
            <option value="HT">Haiti</option>
    
            <option value="HM">Heard Island and McDonald Islands
    
            </option>
    
            <option value="VA">Holy See (Vatican City State)
    
            </option>
    
            <option value="HN">Honduras</option>
    
            <option value="HK">Hong Kong</option>
    
            <option value="HU">Hungary</option>
    
            <option value="IS">Iceland</option>
    
            <option value="IN">India</option>
    
            <option value="ID">Indonesia</option>
    
            <option value="IR">Iran, Islamic Republic of
    
            </option>
    
            <option value="IQ">Iraq</option>
    
            <option value="IE">Ireland</option>
    
            <option value="IM">Isle of Man</option>
    
            <option value="IL">Israel</option>
    
            <option value="IT">Italy</option>
    
            <option value="JM">Jamaica</option>
    
            <option value="JP">Japan</option>
    
            <option value="JE">Jersey</option>
    
            <option value="JO">Jordan</option>
    
            <option value="KZ">Kazakhstan</option>
    
            <option value="KE">Kenya</option>
    
            <option value="KI">Kiribati</option>
    
            <option value="KP">Korea, Democratic People's Republic of
    
            </option>
    
            <option value="KR">Korea, Republic of
    
            </option>
    
            <option value="KW">Kuwait</option>
    
            <option value="KG">Kyrgyzstan</option>
    
            <option value="LA">Lao People's Democratic Republic
    
            </option>
    
            <option value="LV">Latvia</option>
    
            <option value="LB">Lebanon</option>
    
            <option value="LS">Lesotho</option>
    
            <option value="LR">Liberia</option>
    
            <option value="LY">Libya</option>
    
            <option value="LI">Liechtenstein</option>
    
            <option value="LT">Lithuania</option>
    
            <option value="LU">Luxembourg</option>
    
            <option value="MO">Macao</option>
    
            <option value="MK">Macedonia, the former Yugoslav Republic of
    
            </option>
    
            <option value="MG">Madagascar</option>
    
            <option value="MW">Malawi</option>
    
            <option value="MY">Malaysia</option>
    
            <option value="MV">Maldives</option>
    
            <option value="ML">Mali</option>
    
            <option value="MT">Malta</option>
    
            <option value="MH">Marshall Islands
    
            </option>
    
            <option value="MQ">Martinique</option>
    
            <option value="MR">Mauritania</option>
    
            <option value="MU">Mauritius</option>
    
            <option value="YT">Mayotte</option>
    
            <option value="MX">Mexico</option>
    
            <option value="FM">Micronesia, Federated States of
    
            </option>
    
            <option value="MD">Moldova, Republic of
    
            </option>
    
            <option value="MC">Monaco</option>
    
            <option value="MN">Mongolia</option>
    
            <option value="ME">Montenegro</option>
    
            <option value="MS">Montserrat</option>
    
            <option value="MA">Morocco</option>
    
            <option value="MZ">Mozambique</option>
    
            <option value="MM">Myanmar</option>
    
            <option value="NA">Namibia</option>
    
            <option value="NR">Nauru</option>
    
            <option value="NP">Nepal</option>
    
            <option value="NL">Netherlands</option>
    
            <option value="NC">New Caledonia
    
            </option>
    
            <option value="NZ">New Zealand</option>
    
            <option value="NI">Nicaragua</option>
    
            <option value="NE">Niger</option>
    
            <option value="NG">Nigeria</option>
    
            <option value="NU">Niue</option>
    
            <option value="NF">Norfolk Island
    
            </option>
    
            <option value="MP">Northern Mariana Islands
    
            </option>
    
            <option value="NO">Norway</option>
    
            <option value="OM">Oman</option>
    
            <option value="PK">Pakistan</option>
    
            <option value="PW">Palau</option>
    
            <option value="PS">Palestinian Territory, Occupied
    
            </option>
    
            <option value="PA">Panama</option>
    
            <option value="PG">Papua New Guinea
    
            </option>
    
            <option value="PY">Paraguay</option>
    
            <option value="PE">Peru</option>
    
            <option value="PH">Philippines</option>
    
            <option value="PN">Pitcairn</option>
    
            <option value="PL">Poland</option>
    
            <option value="PT">Portugal</option>
    
            <option value="PR">Puerto Rico</option>
    
            <option value="QA">Qatar</option>
    
            <option value="RE">Réunion</option>
    
            <option value="RO">Romania</option>
    
            <option value="RU">Russian Federation
    
            </option>
    
            <option value="RW">Rwanda</option>
    
            <option value="BL">Saint Barthélemy
    
            </option>
    
            <option value="SH">Saint Helena, Ascension and Tristan da Cunha
    
            </option>
    
            <option value="KN">Saint Kitts and Nevis
    
            </option>
    
            <option value="LC">Saint Lucia</option>
    
            <option value="MF">Saint Martin (French part)
    
            </option>
    
            <option value="PM">Saint Pierre and Miquelon
    
            </option>
    
            <option value="VC">Saint Vincent and the Grenadines
    
            </option>
    
            <option value="WS">Samoa</option>
    
            <option value="SM">San Marino</option>
    
            <option value="ST">Sao Tome and Principe
    
            </option>
    
            <option value="SA">Saudi Arabia
    
            </option>
    
            <option value="SN">Senegal</option>
    
            <option value="RS">Serbia</option>
    
            <option value="SC">Seychelles</option>
    
            <option value="SL">Sierra Leone
    
            </option>
    
            <option value="SG">Singapore</option>
    
            <option value="SX">Sint Maarten (Dutch part)
    
            </option>
    
            <option value="SK">Slovakia</option>
    
            <option value="SI">Slovenia</option>
    
            <option value="SB">Solomon Islands
    
            </option>
    
            <option value="SO">Somalia</option>
    
            <option value="ZA">South Africa
    
            </option>
    
            <option value="GS">South Georgia and the South Sandwich Islands
    
            </option>
    
            <option value="SS">South Sudan</option>
    
            <option value="ES">Spain</option>
    
            <option value="LK">Sri Lanka</option>
    
            <option value="SD">Sudan</option>
    
            <option value="SR">Suriname</option>
    
            <option value="SJ">Svalbard and Jan Mayen
    
            </option>
    
            <option value="SZ">Swaziland</option>
    
            <option value="SE">Sweden</option>
    
            <option value="CH">Switzerland</option>
    
            <option value="SY">Syrian Arab Republic
    
            </option>
    
            <option value="TW">Taiwan, Province of China
    
            </option>
    
            <option value="TJ">Tajikistan</option>
    
            <option value="TZ">Tanzania, United Republic of
    
            </option>
    
            <option value="TH">Thailand</option>
    
            <option value="TL">Timor-Leste</option>
    
            <option value="TG">Togo</option>
    
            <option value="TK">Tokelau</option>
    
            <option value="TO">Tonga</option>
    
            <option value="TT">Trinidad and Tobago
    
            </option>
    
            <option value="TN">Tunisia</option>
    
            <option value="TR">Turkey</option>
    
            <option value="TM">Turkmenistan</option>
    
            <option value="TC">Turks and Caicos Islands
    
            </option>
    
            <option value="TV">Tuvalu</option>
    
            <option value="UG">Uganda</option>
    
            <option value="UA">Ukraine</option>
    
            <option value="AE">United Arab Emirates
    
            </option>
    
            <option value="GB">United Kingdom
    
            </option>
    
            <option value="US">United States
    
            </option>
    
            <option value="UM">United States Minor Outlying Islands
    
            </option>
    
            <option value="UY">Uruguay</option>
    
            <option value="UZ">Uzbekistan</option>
    
            <option value="VU">Vanuatu</option>
    
            <option value="VE">Venezuela, Bolivarian Republic of
    
            </option>
    
            <option value="VN">Viet Nam</option>
    
            <option value="VG">Virgin Islands, British
    
            </option>
    
            <option value="VI">Virgin Islands, U.S.
    
            </option>
    
            <option value="WF">Wallis and Futuna
    
            </option>
    
            <option value="EH">Western Sahara
    
            </option>
    
            <option value="YE">Yemen</option>
    
            <option value="ZM">Zambia</option>
    
            <option value="ZW">Zimbabwe</option>
    
          </select>
    
        </div>
    
        <div class="form-group">
    
          <label for="education">Education</label>
    
          <input type="text" class="form-control" id="education" placeholder="Education">
    
        </div>
    
        <div class="form-group">
    
          <label for="skills">Skills</label>
    
          <input type="text" class="form-control" id="skills" placeholder="Skills">
    
        </div>
    
        <div class="form-group">
    
          <label for="linkedIn">My LinkedIn URL</label>
    
          <input type="text" class="form-control" id="linkedIn" placeholder="Your Link to Linked In">
    
        </div>
    
        <button type="submit" class="btn btn-primary">Create a Job 
    
              Profile</button>
    
        <!-- <button type="button" class="btn btn- 
    
                danger">Cancel</button> -->
    
      </form>
    
    </div>
    
  </div>
    
  <div class="col-xs-12">
    
    <div class="well">
    
      <div id="output">
    
        <!-- form input goes here -->
    
      </div>
    
      <!--  <button type="button" class="btn btn- 
    
              danger">Cancel</button> -->
    
    </div>
    
    <button type="button" class="btn btn-danger">Delete</button>
    
  </div>
    
  </div>
    
  <!-- </div> -->
    
  <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    
  <script src="http://sabioapi2.azurewebsites.net/scripts/sabio.js">
    
  </script>
    
  <script type="text/javascript">
    
    sabio.page.startUp = function() {
    

    
      $('button[type="submit"]').on('click', sabio.page.handlers.writeHtml);
    

    

    
      $('button.btn-danger').on('click', sabio.page.hideCar);
    
    };
    
    sabio.page.handlers.writeHtml = function(event) {
    
      event.preventDefault();
    
      // $('#output').show();
    
      var name = $('#name').val();
    
      var headline = $('#headline').val();
    
      var position = $('#position').val();
    
      var spRegion = $('#spRegion').val();
    
      var country = $('#country').val();
    
      var education = $('#education').val();
    
      var skills = $('#skills').val();
    
      var linkedIn = $('#linkedIn').val();
    

    
      $('#output').html(
    
        '<ul style="list-style: none;">' +
    
        '<li>' + name + '</li>' +
    
        '<li> Headline:' + headline + '</li>' +
    
        '<li> Current Position:' + position + '</li>' +
    
        '<li> Location' + spRegion + '</li>' +
    
        '<li> Country' + country + '</li>' +
    
        '<li> Education:' + education + '</li>' +
    
        '<li> Skills:' + skills + '</li>' +
    
        '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
    
        '</ul>');
    
      // $('#output').append('<div><span>make:' +name+
    
      //                '</span></div><div><span>Headline: ' +headline+
    
      //                '</span></div><div><span>Current Position: ' +position+
    
      //                '</span></div><div><span>Location: ' +spRegion+
    
      //                '</span></div><div><span>Country: ' +country+
    
      //                '</span></div><div><span>Education: ' +edcation+
    
      //                '</span></div><div><span>Skills: ' +skills+
    
      //                '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
    
      //                );
    
      $('form')[0].reset();
    
    };
    
    sabio.page.hideCar = function() {
    
      $('#output').hide();
    
    };
    
  </script>
    
</body>
    

    
</html>








    javascript







    share|improve this question



























      0












      0








      0








      With following code, I can append a list that is reading data from the form. But I suppose to make running list, so that if I change any input, on click, another list is created with updated information. My appended information is just a single list instead. How can a make a list of appended profile with every update. Please help!






      <!DOCTYPE html>
      
<html>
      

      
<head>
      
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384- 
      
          BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      
  <title>Employee Profile</title>
      
</head>
      

      
<body>
      
  <div class="container">
      
    <div class="col-xs-6">
      
      <form>
      
        <div class="form-group">
      
          <label for="name">Full Name *</label>
      
          <input type="text" class="form-control" id="name" placeholder="Full Name" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="headline">Headline *</label>
      
          <input type="text" class="form-control" id="headline" placeholder="Headline" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="position">Current Position</label>
      
          <input type="text" class="form-control" id="position" placeholder="Current Position">
      
        </div>
      
        <div class="form-group">
      
          <label for="spRegion">State/Province/Region * 
      
                </label>
      
          <select class="form-control" id="spRegion" required>
      
            <option>Please select</option>
      
            <option value="AL">Alabama</option>
      
            <option value="AK">Alaska</option>
      
            <option value="AZ">Arizona</option>
      
            <option value="AR">Arkansas</option>
      
            <option value="CA">California</option>
      
            <option value="CO">Colorado</option>
      
            <option value="CT">Connecticut</option>
      
            <option value="DE">Delaware</option>
      
            <option value="DC">District Of Columbia
      
            </option>
      
            <option value="FL">Florida</option>
      
            <option value="GA">Georgia</option>
      
            <option value="HI">Hawaii</option>
      
            <option value="ID">Idaho</option>
      
            <option value="IL">Illinois</option>
      
            <option value="IN">Indiana</option>
      
            <option value="IA">Iowa</option>
      
            <option value="KS">Kansas</option>
      
            <option value="KY">Kentucky</option>
      
            <option value="LA">Louisiana</option>
      
            <option value="ME">Maine</option>
      
            <option value="MD">Maryland</option>
      
            <option value="MA">Massachusetts</option>
      
            <option value="MI">Michigan</option>
      
            <option value="MN">Minnesota</option>
      
            <option value="MS">Mississippi</option>
      
            <option value="MO">Missouri</option>
      
            <option value="MT">Montana</option>
      
            <option value="NE">Nebraska</option>
      
            <option value="NV">Nevada</option>
      
            <option value="NH">New Hampshire</option>
      
            <option value="NJ">New Jersey</option>
      
            <option value="NM">New Mexico</option>
      
            <option value="NY">New York</option>
      
            <option value="NC">North Carolina</option>
      
            <option value="ND">North Dakota</option>
      
            <option value="OH">Ohio</option>
      
            <option value="OK">Oklahoma</option>
      
            <option value="OR">Oregon</option>
      
            <option value="PA">Pennsylvania</option>
      
            <option value="RI">Rhode Island</option>
      
            <option value="SC">South Carolina</option>
      
            <option value="SD">South Dakota</option>
      
            <option value="TN">Tennessee</option>
      
            <option value="TX">Texas</option>
      
            <option value="UT">Utah</option>
      
            <option value="VT">Vermont</option>
      
            <option value="VA">Virginia</option>
      
            <option value="WA">Washington</option>
      
            <option value="WV">West Virginia</option>
      
            <option value="WI">Wisconsin</option>
      
            <option value="WY">Wyoming</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="country">Country * </label>
      
          <select class="form-control" id="country" required>
      
            <option>Please select</option>
      
            <option value="AF">Afghanistan</option>
      
            <option value="AX">Åland Islands</option>
      
            <option value="AL">Albania</option>
      
            <option value="DZ">Algeria</option>
      
            <option value="AS">American Samoa</option>
      
            <option value="AD">Andorra</option>
      
            <option value="AO">Angola</option>
      
            <option value="AI">Anguilla</option>
      
            <option value="AQ">Antarctica</option>
      
            <option value="AG">Antigua and Barbuda
      
            </option>
      
            <option value="AR">Argentina</option>
      
            <option value="AM">Armenia</option>
      
            <option value="AW">Aruba</option>
      
            <option value="AU">Australia</option>
      
            <option value="AT">Austria</option>
      
            <option value="AZ">Azerbaijan</option>
      
            <option value="BS">Bahamas</option>
      
            <option value="BH">Bahrain</option>
      
            <option value="BD">Bangladesh</option>
      
            <option value="BB">Barbados</option>
      
            <option value="BY">Belarus</option>
      
            <option value="BE">Belgium</option>
      
            <option value="BZ">Belize</option>
      
            <option value="BJ">Benin</option>
      
            <option value="BM">Bermuda</option>
      
            <option value="BT">Bhutan</option>
      
            <option value="BO">Bolivia, Plurinational State of
      
            </option>
      
            <option value="BQ">Bonaire, Sint Eustatius and Saba
      
            </option>
      
            <option value="BA">Bosnia and Herzegovina
      
            </option>
      
            <option value="BW">Botswana</option>
      
            <option value="BV">Bouvet Island</option>
      
            <option value="BR">Brazil</option>
      
            <option value="IO">British Indian Ocean Territory
      
            </option>
      
            <option value="BN">Brunei Darussalam
      
            </option>
      
            <option value="BG">Bulgaria</option>
      
            <option value="BF">Burkina Faso</option>
      
            <option value="BI">Burundi</option>
      
            <option value="KH">Cambodia</option>
      
            <option value="CM">Cameroon</option>
      
            <option value="CA">Canada</option>
      
            <option value="CV">Cape Verde</option>
      
            <option value="KY">Cayman Islands
      
            </option>
      
            <option value="CF">Central African Republic
      
            </option>
      
            <option value="TD">Chad</option>
      
            <option value="CL">Chile</option>
      
            <option value="CN">China</option>
      
            <option value="CX">Christmas Island
      
            </option>
      
            <option value="CC">Cocos (Keeling) Islands
      
            </option>
      
            <option value="CO">Colombia</option>
      
            <option value="KM">Comoros</option>
      
            <option value="CG">Congo</option>
      
            <option value="CD">Congo, the Democratic Republic of the
      
            </option>
      
            <option value="CK">Cook Islands</option>
      
            <option value="CR">Costa Rica</option>
      
            <option value="CI">Côte d'Ivoire</option>
      
            <option value="HR">Croatia</option>
      
            <option value="CU">Cuba</option>
      
            <option value="CW">Curaçao</option>
      
            <option value="CY">Cyprus</option>
      
            <option value="CZ">Czech Republic
      
            </option>
      
            <option value="DK">Denmark</option>
      
            <option value="DJ">Djibouti</option>
      
            <option value="DM">Dominica</option>
      
            <option value="DO">Dominican Republic
      
            </option>
      
            <option value="EC">Ecuador</option>
      
            <option value="EG">Egypt</option>
      
            <option value="SV">El Salvador</option>
      
            <option value="GQ">Equatorial Guinea
      
            </option>
      
            <option value="ER">Eritrea</option>
      
            <option value="EE">Estonia</option>
      
            <option value="ET">Ethiopia</option>
      
            <option value="FK">Falkland Islands (Malvinas)
      
            </option>
      
            <option value="FO">Faroe Islands
      
            </option>
      
            <option value="FJ">Fiji</option>
      
            <option value="FI">Finland</option>
      
            <option value="FR">France</option>
      
            <option value="GF">French Guiana
      
            </option>
      
            <option value="PF">French Polynesia
      
            </option>
      
            <option value="TF">French Southern Territories
      
            </option>
      
            <option value="GA">Gabon</option>
      
            <option value="GM">Gambia</option>
      
            <option value="GE">Georgia</option>
      
            <option value="DE">Germany</option>
      
            <option value="GH">Ghana</option>
      
            <option value="GI">Gibraltar</option>
      
            <option value="GR">Greece</option>
      
            <option value="GL">Greenland</option>
      
            <option value="GD">Grenada</option>
      
            <option value="GP">Guadeloupe</option>
      
            <option value="GU">Guam</option>
      
            <option value="GT">Guatemala</option>
      
            <option value="GG">Guernsey</option>
      
            <option value="GN">Guinea</option>
      
            <option value="GW">Guinea- Bissau
      
            </option>
      
            <option value="GY">Guyana</option>
      
            <option value="HT">Haiti</option>
      
            <option value="HM">Heard Island and McDonald Islands
      
            </option>
      
            <option value="VA">Holy See (Vatican City State)
      
            </option>
      
            <option value="HN">Honduras</option>
      
            <option value="HK">Hong Kong</option>
      
            <option value="HU">Hungary</option>
      
            <option value="IS">Iceland</option>
      
            <option value="IN">India</option>
      
            <option value="ID">Indonesia</option>
      
            <option value="IR">Iran, Islamic Republic of
      
            </option>
      
            <option value="IQ">Iraq</option>
      
            <option value="IE">Ireland</option>
      
            <option value="IM">Isle of Man</option>
      
            <option value="IL">Israel</option>
      
            <option value="IT">Italy</option>
      
            <option value="JM">Jamaica</option>
      
            <option value="JP">Japan</option>
      
            <option value="JE">Jersey</option>
      
            <option value="JO">Jordan</option>
      
            <option value="KZ">Kazakhstan</option>
      
            <option value="KE">Kenya</option>
      
            <option value="KI">Kiribati</option>
      
            <option value="KP">Korea, Democratic People's Republic of
      
            </option>
      
            <option value="KR">Korea, Republic of
      
            </option>
      
            <option value="KW">Kuwait</option>
      
            <option value="KG">Kyrgyzstan</option>
      
            <option value="LA">Lao People's Democratic Republic
      
            </option>
      
            <option value="LV">Latvia</option>
      
            <option value="LB">Lebanon</option>
      
            <option value="LS">Lesotho</option>
      
            <option value="LR">Liberia</option>
      
            <option value="LY">Libya</option>
      
            <option value="LI">Liechtenstein</option>
      
            <option value="LT">Lithuania</option>
      
            <option value="LU">Luxembourg</option>
      
            <option value="MO">Macao</option>
      
            <option value="MK">Macedonia, the former Yugoslav Republic of
      
            </option>
      
            <option value="MG">Madagascar</option>
      
            <option value="MW">Malawi</option>
      
            <option value="MY">Malaysia</option>
      
            <option value="MV">Maldives</option>
      
            <option value="ML">Mali</option>
      
            <option value="MT">Malta</option>
      
            <option value="MH">Marshall Islands
      
            </option>
      
            <option value="MQ">Martinique</option>
      
            <option value="MR">Mauritania</option>
      
            <option value="MU">Mauritius</option>
      
            <option value="YT">Mayotte</option>
      
            <option value="MX">Mexico</option>
      
            <option value="FM">Micronesia, Federated States of
      
            </option>
      
            <option value="MD">Moldova, Republic of
      
            </option>
      
            <option value="MC">Monaco</option>
      
            <option value="MN">Mongolia</option>
      
            <option value="ME">Montenegro</option>
      
            <option value="MS">Montserrat</option>
      
            <option value="MA">Morocco</option>
      
            <option value="MZ">Mozambique</option>
      
            <option value="MM">Myanmar</option>
      
            <option value="NA">Namibia</option>
      
            <option value="NR">Nauru</option>
      
            <option value="NP">Nepal</option>
      
            <option value="NL">Netherlands</option>
      
            <option value="NC">New Caledonia
      
            </option>
      
            <option value="NZ">New Zealand</option>
      
            <option value="NI">Nicaragua</option>
      
            <option value="NE">Niger</option>
      
            <option value="NG">Nigeria</option>
      
            <option value="NU">Niue</option>
      
            <option value="NF">Norfolk Island
      
            </option>
      
            <option value="MP">Northern Mariana Islands
      
            </option>
      
            <option value="NO">Norway</option>
      
            <option value="OM">Oman</option>
      
            <option value="PK">Pakistan</option>
      
            <option value="PW">Palau</option>
      
            <option value="PS">Palestinian Territory, Occupied
      
            </option>
      
            <option value="PA">Panama</option>
      
            <option value="PG">Papua New Guinea
      
            </option>
      
            <option value="PY">Paraguay</option>
      
            <option value="PE">Peru</option>
      
            <option value="PH">Philippines</option>
      
            <option value="PN">Pitcairn</option>
      
            <option value="PL">Poland</option>
      
            <option value="PT">Portugal</option>
      
            <option value="PR">Puerto Rico</option>
      
            <option value="QA">Qatar</option>
      
            <option value="RE">Réunion</option>
      
            <option value="RO">Romania</option>
      
            <option value="RU">Russian Federation
      
            </option>
      
            <option value="RW">Rwanda</option>
      
            <option value="BL">Saint Barthélemy
      
            </option>
      
            <option value="SH">Saint Helena, Ascension and Tristan da Cunha
      
            </option>
      
            <option value="KN">Saint Kitts and Nevis
      
            </option>
      
            <option value="LC">Saint Lucia</option>
      
            <option value="MF">Saint Martin (French part)
      
            </option>
      
            <option value="PM">Saint Pierre and Miquelon
      
            </option>
      
            <option value="VC">Saint Vincent and the Grenadines
      
            </option>
      
            <option value="WS">Samoa</option>
      
            <option value="SM">San Marino</option>
      
            <option value="ST">Sao Tome and Principe
      
            </option>
      
            <option value="SA">Saudi Arabia
      
            </option>
      
            <option value="SN">Senegal</option>
      
            <option value="RS">Serbia</option>
      
            <option value="SC">Seychelles</option>
      
            <option value="SL">Sierra Leone
      
            </option>
      
            <option value="SG">Singapore</option>
      
            <option value="SX">Sint Maarten (Dutch part)
      
            </option>
      
            <option value="SK">Slovakia</option>
      
            <option value="SI">Slovenia</option>
      
            <option value="SB">Solomon Islands
      
            </option>
      
            <option value="SO">Somalia</option>
      
            <option value="ZA">South Africa
      
            </option>
      
            <option value="GS">South Georgia and the South Sandwich Islands
      
            </option>
      
            <option value="SS">South Sudan</option>
      
            <option value="ES">Spain</option>
      
            <option value="LK">Sri Lanka</option>
      
            <option value="SD">Sudan</option>
      
            <option value="SR">Suriname</option>
      
            <option value="SJ">Svalbard and Jan Mayen
      
            </option>
      
            <option value="SZ">Swaziland</option>
      
            <option value="SE">Sweden</option>
      
            <option value="CH">Switzerland</option>
      
            <option value="SY">Syrian Arab Republic
      
            </option>
      
            <option value="TW">Taiwan, Province of China
      
            </option>
      
            <option value="TJ">Tajikistan</option>
      
            <option value="TZ">Tanzania, United Republic of
      
            </option>
      
            <option value="TH">Thailand</option>
      
            <option value="TL">Timor-Leste</option>
      
            <option value="TG">Togo</option>
      
            <option value="TK">Tokelau</option>
      
            <option value="TO">Tonga</option>
      
            <option value="TT">Trinidad and Tobago
      
            </option>
      
            <option value="TN">Tunisia</option>
      
            <option value="TR">Turkey</option>
      
            <option value="TM">Turkmenistan</option>
      
            <option value="TC">Turks and Caicos Islands
      
            </option>
      
            <option value="TV">Tuvalu</option>
      
            <option value="UG">Uganda</option>
      
            <option value="UA">Ukraine</option>
      
            <option value="AE">United Arab Emirates
      
            </option>
      
            <option value="GB">United Kingdom
      
            </option>
      
            <option value="US">United States
      
            </option>
      
            <option value="UM">United States Minor Outlying Islands
      
            </option>
      
            <option value="UY">Uruguay</option>
      
            <option value="UZ">Uzbekistan</option>
      
            <option value="VU">Vanuatu</option>
      
            <option value="VE">Venezuela, Bolivarian Republic of
      
            </option>
      
            <option value="VN">Viet Nam</option>
      
            <option value="VG">Virgin Islands, British
      
            </option>
      
            <option value="VI">Virgin Islands, U.S.
      
            </option>
      
            <option value="WF">Wallis and Futuna
      
            </option>
      
            <option value="EH">Western Sahara
      
            </option>
      
            <option value="YE">Yemen</option>
      
            <option value="ZM">Zambia</option>
      
            <option value="ZW">Zimbabwe</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="education">Education</label>
      
          <input type="text" class="form-control" id="education" placeholder="Education">
      
        </div>
      
        <div class="form-group">
      
          <label for="skills">Skills</label>
      
          <input type="text" class="form-control" id="skills" placeholder="Skills">
      
        </div>
      
        <div class="form-group">
      
          <label for="linkedIn">My LinkedIn URL</label>
      
          <input type="text" class="form-control" id="linkedIn" placeholder="Your Link to Linked In">
      
        </div>
      
        <button type="submit" class="btn btn-primary">Create a Job 
      
              Profile</button>
      
        <!-- <button type="button" class="btn btn- 
      
                danger">Cancel</button> -->
      
      </form>
      
    </div>
      
  </div>
      
  <div class="col-xs-12">
      
    <div class="well">
      
      <div id="output">
      
        <!-- form input goes here -->
      
      </div>
      
      <!--  <button type="button" class="btn btn- 
      
              danger">Cancel</button> -->
      
    </div>
      
    <button type="button" class="btn btn-danger">Delete</button>
      
  </div>
      
  </div>
      
  <!-- </div> -->
      
  <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
      
  <script src="http://sabioapi2.azurewebsites.net/scripts/sabio.js">
      
  </script>
      
  <script type="text/javascript">
      
    sabio.page.startUp = function() {
      

      
      $('button[type="submit"]').on('click', sabio.page.handlers.writeHtml);
      

      

      
      $('button.btn-danger').on('click', sabio.page.hideCar);
      
    };
      
    sabio.page.handlers.writeHtml = function(event) {
      
      event.preventDefault();
      
      // $('#output').show();
      
      var name = $('#name').val();
      
      var headline = $('#headline').val();
      
      var position = $('#position').val();
      
      var spRegion = $('#spRegion').val();
      
      var country = $('#country').val();
      
      var education = $('#education').val();
      
      var skills = $('#skills').val();
      
      var linkedIn = $('#linkedIn').val();
      

      
      $('#output').html(
      
        '<ul style="list-style: none;">' +
      
        '<li>' + name + '</li>' +
      
        '<li> Headline:' + headline + '</li>' +
      
        '<li> Current Position:' + position + '</li>' +
      
        '<li> Location' + spRegion + '</li>' +
      
        '<li> Country' + country + '</li>' +
      
        '<li> Education:' + education + '</li>' +
      
        '<li> Skills:' + skills + '</li>' +
      
        '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
      
        '</ul>');
      
      // $('#output').append('<div><span>make:' +name+
      
      //                '</span></div><div><span>Headline: ' +headline+
      
      //                '</span></div><div><span>Current Position: ' +position+
      
      //                '</span></div><div><span>Location: ' +spRegion+
      
      //                '</span></div><div><span>Country: ' +country+
      
      //                '</span></div><div><span>Education: ' +edcation+
      
      //                '</span></div><div><span>Skills: ' +skills+
      
      //                '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
      
      //                );
      
      $('form')[0].reset();
      
    };
      
    sabio.page.hideCar = function() {
      
      $('#output').hide();
      
    };
      
  </script>
      
</body>
      

      
</html>








      javascript







      share|improve this question
















      With following code, I can append a list that is reading data from the form. But I suppose to make running list, so that if I change any input, on click, another list is created with updated information. My appended information is just a single list instead. How can a make a list of appended profile with every update. Please help!






      <!DOCTYPE html>
      
<html>
      

      
<head>
      
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384- 
      
          BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      
  <title>Employee Profile</title>
      
</head>
      

      
<body>
      
  <div class="container">
      
    <div class="col-xs-6">
      
      <form>
      
        <div class="form-group">
      
          <label for="name">Full Name *</label>
      
          <input type="text" class="form-control" id="name" placeholder="Full Name" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="headline">Headline *</label>
      
          <input type="text" class="form-control" id="headline" placeholder="Headline" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="position">Current Position</label>
      
          <input type="text" class="form-control" id="position" placeholder="Current Position">
      
        </div>
      
        <div class="form-group">
      
          <label for="spRegion">State/Province/Region * 
      
                </label>
      
          <select class="form-control" id="spRegion" required>
      
            <option>Please select</option>
      
            <option value="AL">Alabama</option>
      
            <option value="AK">Alaska</option>
      
            <option value="AZ">Arizona</option>
      
            <option value="AR">Arkansas</option>
      
            <option value="CA">California</option>
      
            <option value="CO">Colorado</option>
      
            <option value="CT">Connecticut</option>
      
            <option value="DE">Delaware</option>
      
            <option value="DC">District Of Columbia
      
            </option>
      
            <option value="FL">Florida</option>
      
            <option value="GA">Georgia</option>
      
            <option value="HI">Hawaii</option>
      
            <option value="ID">Idaho</option>
      
            <option value="IL">Illinois</option>
      
            <option value="IN">Indiana</option>
      
            <option value="IA">Iowa</option>
      
            <option value="KS">Kansas</option>
      
            <option value="KY">Kentucky</option>
      
            <option value="LA">Louisiana</option>
      
            <option value="ME">Maine</option>
      
            <option value="MD">Maryland</option>
      
            <option value="MA">Massachusetts</option>
      
            <option value="MI">Michigan</option>
      
            <option value="MN">Minnesota</option>
      
            <option value="MS">Mississippi</option>
      
            <option value="MO">Missouri</option>
      
            <option value="MT">Montana</option>
      
            <option value="NE">Nebraska</option>
      
            <option value="NV">Nevada</option>
      
            <option value="NH">New Hampshire</option>
      
            <option value="NJ">New Jersey</option>
      
            <option value="NM">New Mexico</option>
      
            <option value="NY">New York</option>
      
            <option value="NC">North Carolina</option>
      
            <option value="ND">North Dakota</option>
      
            <option value="OH">Ohio</option>
      
            <option value="OK">Oklahoma</option>
      
            <option value="OR">Oregon</option>
      
            <option value="PA">Pennsylvania</option>
      
            <option value="RI">Rhode Island</option>
      
            <option value="SC">South Carolina</option>
      
            <option value="SD">South Dakota</option>
      
            <option value="TN">Tennessee</option>
      
            <option value="TX">Texas</option>
      
            <option value="UT">Utah</option>
      
            <option value="VT">Vermont</option>
      
            <option value="VA">Virginia</option>
      
            <option value="WA">Washington</option>
      
            <option value="WV">West Virginia</option>
      
            <option value="WI">Wisconsin</option>
      
            <option value="WY">Wyoming</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="country">Country * </label>
      
          <select class="form-control" id="country" required>
      
            <option>Please select</option>
      
            <option value="AF">Afghanistan</option>
      
            <option value="AX">Åland Islands</option>
      
            <option value="AL">Albania</option>
      
            <option value="DZ">Algeria</option>
      
            <option value="AS">American Samoa</option>
      
            <option value="AD">Andorra</option>
      
            <option value="AO">Angola</option>
      
            <option value="AI">Anguilla</option>
      
            <option value="AQ">Antarctica</option>
      
            <option value="AG">Antigua and Barbuda
      
            </option>
      
            <option value="AR">Argentina</option>
      
            <option value="AM">Armenia</option>
      
            <option value="AW">Aruba</option>
      
            <option value="AU">Australia</option>
      
            <option value="AT">Austria</option>
      
            <option value="AZ">Azerbaijan</option>
      
            <option value="BS">Bahamas</option>
      
            <option value="BH">Bahrain</option>
      
            <option value="BD">Bangladesh</option>
      
            <option value="BB">Barbados</option>
      
            <option value="BY">Belarus</option>
      
            <option value="BE">Belgium</option>
      
            <option value="BZ">Belize</option>
      
            <option value="BJ">Benin</option>
      
            <option value="BM">Bermuda</option>
      
            <option value="BT">Bhutan</option>
      
            <option value="BO">Bolivia, Plurinational State of
      
            </option>
      
            <option value="BQ">Bonaire, Sint Eustatius and Saba
      
            </option>
      
            <option value="BA">Bosnia and Herzegovina
      
            </option>
      
            <option value="BW">Botswana</option>
      
            <option value="BV">Bouvet Island</option>
      
            <option value="BR">Brazil</option>
      
            <option value="IO">British Indian Ocean Territory
      
            </option>
      
            <option value="BN">Brunei Darussalam
      
            </option>
      
            <option value="BG">Bulgaria</option>
      
            <option value="BF">Burkina Faso</option>
      
            <option value="BI">Burundi</option>
      
            <option value="KH">Cambodia</option>
      
            <option value="CM">Cameroon</option>
      
            <option value="CA">Canada</option>
      
            <option value="CV">Cape Verde</option>
      
            <option value="KY">Cayman Islands
      
            </option>
      
            <option value="CF">Central African Republic
      
            </option>
      
            <option value="TD">Chad</option>
      
            <option value="CL">Chile</option>
      
            <option value="CN">China</option>
      
            <option value="CX">Christmas Island
      
            </option>
      
            <option value="CC">Cocos (Keeling) Islands
      
            </option>
      
            <option value="CO">Colombia</option>
      
            <option value="KM">Comoros</option>
      
            <option value="CG">Congo</option>
      
            <option value="CD">Congo, the Democratic Republic of the
      
            </option>
      
            <option value="CK">Cook Islands</option>
      
            <option value="CR">Costa Rica</option>
      
            <option value="CI">Côte d'Ivoire</option>
      
            <option value="HR">Croatia</option>
      
            <option value="CU">Cuba</option>
      
            <option value="CW">Curaçao</option>
      
            <option value="CY">Cyprus</option>
      
            <option value="CZ">Czech Republic
      
            </option>
      
            <option value="DK">Denmark</option>
      
            <option value="DJ">Djibouti</option>
      
            <option value="DM">Dominica</option>
      
            <option value="DO">Dominican Republic
      
            </option>
      
            <option value="EC">Ecuador</option>
      
            <option value="EG">Egypt</option>
      
            <option value="SV">El Salvador</option>
      
            <option value="GQ">Equatorial Guinea
      
            </option>
      
            <option value="ER">Eritrea</option>
      
            <option value="EE">Estonia</option>
      
            <option value="ET">Ethiopia</option>
      
            <option value="FK">Falkland Islands (Malvinas)
      
            </option>
      
            <option value="FO">Faroe Islands
      
            </option>
      
            <option value="FJ">Fiji</option>
      
            <option value="FI">Finland</option>
      
            <option value="FR">France</option>
      
            <option value="GF">French Guiana
      
            </option>
      
            <option value="PF">French Polynesia
      
            </option>
      
            <option value="TF">French Southern Territories
      
            </option>
      
            <option value="GA">Gabon</option>
      
            <option value="GM">Gambia</option>
      
            <option value="GE">Georgia</option>
      
            <option value="DE">Germany</option>
      
            <option value="GH">Ghana</option>
      
            <option value="GI">Gibraltar</option>
      
            <option value="GR">Greece</option>
      
            <option value="GL">Greenland</option>
      
            <option value="GD">Grenada</option>
      
            <option value="GP">Guadeloupe</option>
      
            <option value="GU">Guam</option>
      
            <option value="GT">Guatemala</option>
      
            <option value="GG">Guernsey</option>
      
            <option value="GN">Guinea</option>
      
            <option value="GW">Guinea- Bissau
      
            </option>
      
            <option value="GY">Guyana</option>
      
            <option value="HT">Haiti</option>
      
            <option value="HM">Heard Island and McDonald Islands
      
            </option>
      
            <option value="VA">Holy See (Vatican City State)
      
            </option>
      
            <option value="HN">Honduras</option>
      
            <option value="HK">Hong Kong</option>
      
            <option value="HU">Hungary</option>
      
            <option value="IS">Iceland</option>
      
            <option value="IN">India</option>
      
            <option value="ID">Indonesia</option>
      
            <option value="IR">Iran, Islamic Republic of
      
            </option>
      
            <option value="IQ">Iraq</option>
      
            <option value="IE">Ireland</option>
      
            <option value="IM">Isle of Man</option>
      
            <option value="IL">Israel</option>
      
            <option value="IT">Italy</option>
      
            <option value="JM">Jamaica</option>
      
            <option value="JP">Japan</option>
      
            <option value="JE">Jersey</option>
      
            <option value="JO">Jordan</option>
      
            <option value="KZ">Kazakhstan</option>
      
            <option value="KE">Kenya</option>
      
            <option value="KI">Kiribati</option>
      
            <option value="KP">Korea, Democratic People's Republic of
      
            </option>
      
            <option value="KR">Korea, Republic of
      
            </option>
      
            <option value="KW">Kuwait</option>
      
            <option value="KG">Kyrgyzstan</option>
      
            <option value="LA">Lao People's Democratic Republic
      
            </option>
      
            <option value="LV">Latvia</option>
      
            <option value="LB">Lebanon</option>
      
            <option value="LS">Lesotho</option>
      
            <option value="LR">Liberia</option>
      
            <option value="LY">Libya</option>
      
            <option value="LI">Liechtenstein</option>
      
            <option value="LT">Lithuania</option>
      
            <option value="LU">Luxembourg</option>
      
            <option value="MO">Macao</option>
      
            <option value="MK">Macedonia, the former Yugoslav Republic of
      
            </option>
      
            <option value="MG">Madagascar</option>
      
            <option value="MW">Malawi</option>
      
            <option value="MY">Malaysia</option>
      
            <option value="MV">Maldives</option>
      
            <option value="ML">Mali</option>
      
            <option value="MT">Malta</option>
      
            <option value="MH">Marshall Islands
      
            </option>
      
            <option value="MQ">Martinique</option>
      
            <option value="MR">Mauritania</option>
      
            <option value="MU">Mauritius</option>
      
            <option value="YT">Mayotte</option>
      
            <option value="MX">Mexico</option>
      
            <option value="FM">Micronesia, Federated States of
      
            </option>
      
            <option value="MD">Moldova, Republic of
      
            </option>
      
            <option value="MC">Monaco</option>
      
            <option value="MN">Mongolia</option>
      
            <option value="ME">Montenegro</option>
      
            <option value="MS">Montserrat</option>
      
            <option value="MA">Morocco</option>
      
            <option value="MZ">Mozambique</option>
      
            <option value="MM">Myanmar</option>
      
            <option value="NA">Namibia</option>
      
            <option value="NR">Nauru</option>
      
            <option value="NP">Nepal</option>
      
            <option value="NL">Netherlands</option>
      
            <option value="NC">New Caledonia
      
            </option>
      
            <option value="NZ">New Zealand</option>
      
            <option value="NI">Nicaragua</option>
      
            <option value="NE">Niger</option>
      
            <option value="NG">Nigeria</option>
      
            <option value="NU">Niue</option>
      
            <option value="NF">Norfolk Island
      
            </option>
      
            <option value="MP">Northern Mariana Islands
      
            </option>
      
            <option value="NO">Norway</option>
      
            <option value="OM">Oman</option>
      
            <option value="PK">Pakistan</option>
      
            <option value="PW">Palau</option>
      
            <option value="PS">Palestinian Territory, Occupied
      
            </option>
      
            <option value="PA">Panama</option>
      
            <option value="PG">Papua New Guinea
      
            </option>
      
            <option value="PY">Paraguay</option>
      
            <option value="PE">Peru</option>
      
            <option value="PH">Philippines</option>
      
            <option value="PN">Pitcairn</option>
      
            <option value="PL">Poland</option>
      
            <option value="PT">Portugal</option>
      
            <option value="PR">Puerto Rico</option>
      
            <option value="QA">Qatar</option>
      
            <option value="RE">Réunion</option>
      
            <option value="RO">Romania</option>
      
            <option value="RU">Russian Federation
      
            </option>
      
            <option value="RW">Rwanda</option>
      
            <option value="BL">Saint Barthélemy
      
            </option>
      
            <option value="SH">Saint Helena, Ascension and Tristan da Cunha
      
            </option>
      
            <option value="KN">Saint Kitts and Nevis
      
            </option>
      
            <option value="LC">Saint Lucia</option>
      
            <option value="MF">Saint Martin (French part)
      
            </option>
      
            <option value="PM">Saint Pierre and Miquelon
      
            </option>
      
            <option value="VC">Saint Vincent and the Grenadines
      
            </option>
      
            <option value="WS">Samoa</option>
      
            <option value="SM">San Marino</option>
      
            <option value="ST">Sao Tome and Principe
      
            </option>
      
            <option value="SA">Saudi Arabia
      
            </option>
      
            <option value="SN">Senegal</option>
      
            <option value="RS">Serbia</option>
      
            <option value="SC">Seychelles</option>
      
            <option value="SL">Sierra Leone
      
            </option>
      
            <option value="SG">Singapore</option>
      
            <option value="SX">Sint Maarten (Dutch part)
      
            </option>
      
            <option value="SK">Slovakia</option>
      
            <option value="SI">Slovenia</option>
      
            <option value="SB">Solomon Islands
      
            </option>
      
            <option value="SO">Somalia</option>
      
            <option value="ZA">South Africa
      
            </option>
      
            <option value="GS">South Georgia and the South Sandwich Islands
      
            </option>
      
            <option value="SS">South Sudan</option>
      
            <option value="ES">Spain</option>
      
            <option value="LK">Sri Lanka</option>
      
            <option value="SD">Sudan</option>
      
            <option value="SR">Suriname</option>
      
            <option value="SJ">Svalbard and Jan Mayen
      
            </option>
      
            <option value="SZ">Swaziland</option>
      
            <option value="SE">Sweden</option>
      
            <option value="CH">Switzerland</option>
      
            <option value="SY">Syrian Arab Republic
      
            </option>
      
            <option value="TW">Taiwan, Province of China
      
            </option>
      
            <option value="TJ">Tajikistan</option>
      
            <option value="TZ">Tanzania, United Republic of
      
            </option>
      
            <option value="TH">Thailand</option>
      
            <option value="TL">Timor-Leste</option>
      
            <option value="TG">Togo</option>
      
            <option value="TK">Tokelau</option>
      
            <option value="TO">Tonga</option>
      
            <option value="TT">Trinidad and Tobago
      
            </option>
      
            <option value="TN">Tunisia</option>
      
            <option value="TR">Turkey</option>
      
            <option value="TM">Turkmenistan</option>
      
            <option value="TC">Turks and Caicos Islands
      
            </option>
      
            <option value="TV">Tuvalu</option>
      
            <option value="UG">Uganda</option>
      
            <option value="UA">Ukraine</option>
      
            <option value="AE">United Arab Emirates
      
            </option>
      
            <option value="GB">United Kingdom
      
            </option>
      
            <option value="US">United States
      
            </option>
      
            <option value="UM">United States Minor Outlying Islands
      
            </option>
      
            <option value="UY">Uruguay</option>
      
            <option value="UZ">Uzbekistan</option>
      
            <option value="VU">Vanuatu</option>
      
            <option value="VE">Venezuela, Bolivarian Republic of
      
            </option>
      
            <option value="VN">Viet Nam</option>
      
            <option value="VG">Virgin Islands, British
      
            </option>
      
            <option value="VI">Virgin Islands, U.S.
      
            </option>
      
            <option value="WF">Wallis and Futuna
      
            </option>
      
            <option value="EH">Western Sahara
      
            </option>
      
            <option value="YE">Yemen</option>
      
            <option value="ZM">Zambia</option>
      
            <option value="ZW">Zimbabwe</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="education">Education</label>
      
          <input type="text" class="form-control" id="education" placeholder="Education">
      
        </div>
      
        <div class="form-group">
      
          <label for="skills">Skills</label>
      
          <input type="text" class="form-control" id="skills" placeholder="Skills">
      
        </div>
      
        <div class="form-group">
      
          <label for="linkedIn">My LinkedIn URL</label>
      
          <input type="text" class="form-control" id="linkedIn" placeholder="Your Link to Linked In">
      
        </div>
      
        <button type="submit" class="btn btn-primary">Create a Job 
      
              Profile</button>
      
        <!-- <button type="button" class="btn btn- 
      
                danger">Cancel</button> -->
      
      </form>
      
    </div>
      
  </div>
      
  <div class="col-xs-12">
      
    <div class="well">
      
      <div id="output">
      
        <!-- form input goes here -->
      
      </div>
      
      <!--  <button type="button" class="btn btn- 
      
              danger">Cancel</button> -->
      
    </div>
      
    <button type="button" class="btn btn-danger">Delete</button>
      
  </div>
      
  </div>
      
  <!-- </div> -->
      
  <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
      
  <script src="http://sabioapi2.azurewebsites.net/scripts/sabio.js">
      
  </script>
      
  <script type="text/javascript">
      
    sabio.page.startUp = function() {
      

      
      $('button[type="submit"]').on('click', sabio.page.handlers.writeHtml);
      

      

      
      $('button.btn-danger').on('click', sabio.page.hideCar);
      
    };
      
    sabio.page.handlers.writeHtml = function(event) {
      
      event.preventDefault();
      
      // $('#output').show();
      
      var name = $('#name').val();
      
      var headline = $('#headline').val();
      
      var position = $('#position').val();
      
      var spRegion = $('#spRegion').val();
      
      var country = $('#country').val();
      
      var education = $('#education').val();
      
      var skills = $('#skills').val();
      
      var linkedIn = $('#linkedIn').val();
      

      
      $('#output').html(
      
        '<ul style="list-style: none;">' +
      
        '<li>' + name + '</li>' +
      
        '<li> Headline:' + headline + '</li>' +
      
        '<li> Current Position:' + position + '</li>' +
      
        '<li> Location' + spRegion + '</li>' +
      
        '<li> Country' + country + '</li>' +
      
        '<li> Education:' + education + '</li>' +
      
        '<li> Skills:' + skills + '</li>' +
      
        '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
      
        '</ul>');
      
      // $('#output').append('<div><span>make:' +name+
      
      //                '</span></div><div><span>Headline: ' +headline+
      
      //                '</span></div><div><span>Current Position: ' +position+
      
      //                '</span></div><div><span>Location: ' +spRegion+
      
      //                '</span></div><div><span>Country: ' +country+
      
      //                '</span></div><div><span>Education: ' +edcation+
      
      //                '</span></div><div><span>Skills: ' +skills+
      
      //                '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
      
      //                );
      
      $('form')[0].reset();
      
    };
      
    sabio.page.hideCar = function() {
      
      $('#output').hide();
      
    };
      
  </script>
      
</body>
      

      
</html>








      <!DOCTYPE html>
      
<html>
      

      
<head>
      
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384- 
      
          BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      
  <title>Employee Profile</title>
      
</head>
      

      
<body>
      
  <div class="container">
      
    <div class="col-xs-6">
      
      <form>
      
        <div class="form-group">
      
          <label for="name">Full Name *</label>
      
          <input type="text" class="form-control" id="name" placeholder="Full Name" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="headline">Headline *</label>
      
          <input type="text" class="form-control" id="headline" placeholder="Headline" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="position">Current Position</label>
      
          <input type="text" class="form-control" id="position" placeholder="Current Position">
      
        </div>
      
        <div class="form-group">
      
          <label for="spRegion">State/Province/Region * 
      
                </label>
      
          <select class="form-control" id="spRegion" required>
      
            <option>Please select</option>
      
            <option value="AL">Alabama</option>
      
            <option value="AK">Alaska</option>
      
            <option value="AZ">Arizona</option>
      
            <option value="AR">Arkansas</option>
      
            <option value="CA">California</option>
      
            <option value="CO">Colorado</option>
      
            <option value="CT">Connecticut</option>
      
            <option value="DE">Delaware</option>
      
            <option value="DC">District Of Columbia
      
            </option>
      
            <option value="FL">Florida</option>
      
            <option value="GA">Georgia</option>
      
            <option value="HI">Hawaii</option>
      
            <option value="ID">Idaho</option>
      
            <option value="IL">Illinois</option>
      
            <option value="IN">Indiana</option>
      
            <option value="IA">Iowa</option>
      
            <option value="KS">Kansas</option>
      
            <option value="KY">Kentucky</option>
      
            <option value="LA">Louisiana</option>
      
            <option value="ME">Maine</option>
      
            <option value="MD">Maryland</option>
      
            <option value="MA">Massachusetts</option>
      
            <option value="MI">Michigan</option>
      
            <option value="MN">Minnesota</option>
      
            <option value="MS">Mississippi</option>
      
            <option value="MO">Missouri</option>
      
            <option value="MT">Montana</option>
      
            <option value="NE">Nebraska</option>
      
            <option value="NV">Nevada</option>
      
            <option value="NH">New Hampshire</option>
      
            <option value="NJ">New Jersey</option>
      
            <option value="NM">New Mexico</option>
      
            <option value="NY">New York</option>
      
            <option value="NC">North Carolina</option>
      
            <option value="ND">North Dakota</option>
      
            <option value="OH">Ohio</option>
      
            <option value="OK">Oklahoma</option>
      
            <option value="OR">Oregon</option>
      
            <option value="PA">Pennsylvania</option>
      
            <option value="RI">Rhode Island</option>
      
            <option value="SC">South Carolina</option>
      
            <option value="SD">South Dakota</option>
      
            <option value="TN">Tennessee</option>
      
            <option value="TX">Texas</option>
      
            <option value="UT">Utah</option>
      
            <option value="VT">Vermont</option>
      
            <option value="VA">Virginia</option>
      
            <option value="WA">Washington</option>
      
            <option value="WV">West Virginia</option>
      
            <option value="WI">Wisconsin</option>
      
            <option value="WY">Wyoming</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="country">Country * </label>
      
          <select class="form-control" id="country" required>
      
            <option>Please select</option>
      
            <option value="AF">Afghanistan</option>
      
            <option value="AX">Åland Islands</option>
      
            <option value="AL">Albania</option>
      
            <option value="DZ">Algeria</option>
      
            <option value="AS">American Samoa</option>
      
            <option value="AD">Andorra</option>
      
            <option value="AO">Angola</option>
      
            <option value="AI">Anguilla</option>
      
            <option value="AQ">Antarctica</option>
      
            <option value="AG">Antigua and Barbuda
      
            </option>
      
            <option value="AR">Argentina</option>
      
            <option value="AM">Armenia</option>
      
            <option value="AW">Aruba</option>
      
            <option value="AU">Australia</option>
      
            <option value="AT">Austria</option>
      
            <option value="AZ">Azerbaijan</option>
      
            <option value="BS">Bahamas</option>
      
            <option value="BH">Bahrain</option>
      
            <option value="BD">Bangladesh</option>
      
            <option value="BB">Barbados</option>
      
            <option value="BY">Belarus</option>
      
            <option value="BE">Belgium</option>
      
            <option value="BZ">Belize</option>
      
            <option value="BJ">Benin</option>
      
            <option value="BM">Bermuda</option>
      
            <option value="BT">Bhutan</option>
      
            <option value="BO">Bolivia, Plurinational State of
      
            </option>
      
            <option value="BQ">Bonaire, Sint Eustatius and Saba
      
            </option>
      
            <option value="BA">Bosnia and Herzegovina
      
            </option>
      
            <option value="BW">Botswana</option>
      
            <option value="BV">Bouvet Island</option>
      
            <option value="BR">Brazil</option>
      
            <option value="IO">British Indian Ocean Territory
      
            </option>
      
            <option value="BN">Brunei Darussalam
      
            </option>
      
            <option value="BG">Bulgaria</option>
      
            <option value="BF">Burkina Faso</option>
      
            <option value="BI">Burundi</option>
      
            <option value="KH">Cambodia</option>
      
            <option value="CM">Cameroon</option>
      
            <option value="CA">Canada</option>
      
            <option value="CV">Cape Verde</option>
      
            <option value="KY">Cayman Islands
      
            </option>
      
            <option value="CF">Central African Republic
      
            </option>
      
            <option value="TD">Chad</option>
      
            <option value="CL">Chile</option>
      
            <option value="CN">China</option>
      
            <option value="CX">Christmas Island
      
            </option>
      
            <option value="CC">Cocos (Keeling) Islands
      
            </option>
      
            <option value="CO">Colombia</option>
      
            <option value="KM">Comoros</option>
      
            <option value="CG">Congo</option>
      
            <option value="CD">Congo, the Democratic Republic of the
      
            </option>
      
            <option value="CK">Cook Islands</option>
      
            <option value="CR">Costa Rica</option>
      
            <option value="CI">Côte d'Ivoire</option>
      
            <option value="HR">Croatia</option>
      
            <option value="CU">Cuba</option>
      
            <option value="CW">Curaçao</option>
      
            <option value="CY">Cyprus</option>
      
            <option value="CZ">Czech Republic
      
            </option>
      
            <option value="DK">Denmark</option>
      
            <option value="DJ">Djibouti</option>
      
            <option value="DM">Dominica</option>
      
            <option value="DO">Dominican Republic
      
            </option>
      
            <option value="EC">Ecuador</option>
      
            <option value="EG">Egypt</option>
      
            <option value="SV">El Salvador</option>
      
            <option value="GQ">Equatorial Guinea
      
            </option>
      
            <option value="ER">Eritrea</option>
      
            <option value="EE">Estonia</option>
      
            <option value="ET">Ethiopia</option>
      
            <option value="FK">Falkland Islands (Malvinas)
      
            </option>
      
            <option value="FO">Faroe Islands
      
            </option>
      
            <option value="FJ">Fiji</option>
      
            <option value="FI">Finland</option>
      
            <option value="FR">France</option>
      
            <option value="GF">French Guiana
      
            </option>
      
            <option value="PF">French Polynesia
      
            </option>
      
            <option value="TF">French Southern Territories
      
            </option>
      
            <option value="GA">Gabon</option>
      
            <option value="GM">Gambia</option>
      
            <option value="GE">Georgia</option>
      
            <option value="DE">Germany</option>
      
            <option value="GH">Ghana</option>
      
            <option value="GI">Gibraltar</option>
      
            <option value="GR">Greece</option>
      
            <option value="GL">Greenland</option>
      
            <option value="GD">Grenada</option>
      
            <option value="GP">Guadeloupe</option>
      
            <option value="GU">Guam</option>
      
            <option value="GT">Guatemala</option>
      
            <option value="GG">Guernsey</option>
      
            <option value="GN">Guinea</option>
      
            <option value="GW">Guinea- Bissau
      
            </option>
      
            <option value="GY">Guyana</option>
      
            <option value="HT">Haiti</option>
      
            <option value="HM">Heard Island and McDonald Islands
      
            </option>
      
            <option value="VA">Holy See (Vatican City State)
      
            </option>
      
            <option value="HN">Honduras</option>
      
            <option value="HK">Hong Kong</option>
      
            <option value="HU">Hungary</option>
      
            <option value="IS">Iceland</option>
      
            <option value="IN">India</option>
      
            <option value="ID">Indonesia</option>
      
            <option value="IR">Iran, Islamic Republic of
      
            </option>
      
            <option value="IQ">Iraq</option>
      
            <option value="IE">Ireland</option>
      
            <option value="IM">Isle of Man</option>
      
            <option value="IL">Israel</option>
      
            <option value="IT">Italy</option>
      
            <option value="JM">Jamaica</option>
      
            <option value="JP">Japan</option>
      
            <option value="JE">Jersey</option>
      
            <option value="JO">Jordan</option>
      
            <option value="KZ">Kazakhstan</option>
      
            <option value="KE">Kenya</option>
      
            <option value="KI">Kiribati</option>
      
            <option value="KP">Korea, Democratic People's Republic of
      
            </option>
      
            <option value="KR">Korea, Republic of
      
            </option>
      
            <option value="KW">Kuwait</option>
      
            <option value="KG">Kyrgyzstan</option>
      
            <option value="LA">Lao People's Democratic Republic
      
            </option>
      
            <option value="LV">Latvia</option>
      
            <option value="LB">Lebanon</option>
      
            <option value="LS">Lesotho</option>
      
            <option value="LR">Liberia</option>
      
            <option value="LY">Libya</option>
      
            <option value="LI">Liechtenstein</option>
      
            <option value="LT">Lithuania</option>
      
            <option value="LU">Luxembourg</option>
      
            <option value="MO">Macao</option>
      
            <option value="MK">Macedonia, the former Yugoslav Republic of
      
            </option>
      
            <option value="MG">Madagascar</option>
      
            <option value="MW">Malawi</option>
      
            <option value="MY">Malaysia</option>
      
            <option value="MV">Maldives</option>
      
            <option value="ML">Mali</option>
      
            <option value="MT">Malta</option>
      
            <option value="MH">Marshall Islands
      
            </option>
      
            <option value="MQ">Martinique</option>
      
            <option value="MR">Mauritania</option>
      
            <option value="MU">Mauritius</option>
      
            <option value="YT">Mayotte</option>
      
            <option value="MX">Mexico</option>
      
            <option value="FM">Micronesia, Federated States of
      
            </option>
      
            <option value="MD">Moldova, Republic of
      
            </option>
      
            <option value="MC">Monaco</option>
      
            <option value="MN">Mongolia</option>
      
            <option value="ME">Montenegro</option>
      
            <option value="MS">Montserrat</option>
      
            <option value="MA">Morocco</option>
      
            <option value="MZ">Mozambique</option>
      
            <option value="MM">Myanmar</option>
      
            <option value="NA">Namibia</option>
      
            <option value="NR">Nauru</option>
      
            <option value="NP">Nepal</option>
      
            <option value="NL">Netherlands</option>
      
            <option value="NC">New Caledonia
      
            </option>
      
            <option value="NZ">New Zealand</option>
      
            <option value="NI">Nicaragua</option>
      
            <option value="NE">Niger</option>
      
            <option value="NG">Nigeria</option>
      
            <option value="NU">Niue</option>
      
            <option value="NF">Norfolk Island
      
            </option>
      
            <option value="MP">Northern Mariana Islands
      
            </option>
      
            <option value="NO">Norway</option>
      
            <option value="OM">Oman</option>
      
            <option value="PK">Pakistan</option>
      
            <option value="PW">Palau</option>
      
            <option value="PS">Palestinian Territory, Occupied
      
            </option>
      
            <option value="PA">Panama</option>
      
            <option value="PG">Papua New Guinea
      
            </option>
      
            <option value="PY">Paraguay</option>
      
            <option value="PE">Peru</option>
      
            <option value="PH">Philippines</option>
      
            <option value="PN">Pitcairn</option>
      
            <option value="PL">Poland</option>
      
            <option value="PT">Portugal</option>
      
            <option value="PR">Puerto Rico</option>
      
            <option value="QA">Qatar</option>
      
            <option value="RE">Réunion</option>
      
            <option value="RO">Romania</option>
      
            <option value="RU">Russian Federation
      
            </option>
      
            <option value="RW">Rwanda</option>
      
            <option value="BL">Saint Barthélemy
      
            </option>
      
            <option value="SH">Saint Helena, Ascension and Tristan da Cunha
      
            </option>
      
            <option value="KN">Saint Kitts and Nevis
      
            </option>
      
            <option value="LC">Saint Lucia</option>
      
            <option value="MF">Saint Martin (French part)
      
            </option>
      
            <option value="PM">Saint Pierre and Miquelon
      
            </option>
      
            <option value="VC">Saint Vincent and the Grenadines
      
            </option>
      
            <option value="WS">Samoa</option>
      
            <option value="SM">San Marino</option>
      
            <option value="ST">Sao Tome and Principe
      
            </option>
      
            <option value="SA">Saudi Arabia
      
            </option>
      
            <option value="SN">Senegal</option>
      
            <option value="RS">Serbia</option>
      
            <option value="SC">Seychelles</option>
      
            <option value="SL">Sierra Leone
      
            </option>
      
            <option value="SG">Singapore</option>
      
            <option value="SX">Sint Maarten (Dutch part)
      
            </option>
      
            <option value="SK">Slovakia</option>
      
            <option value="SI">Slovenia</option>
      
            <option value="SB">Solomon Islands
      
            </option>
      
            <option value="SO">Somalia</option>
      
            <option value="ZA">South Africa
      
            </option>
      
            <option value="GS">South Georgia and the South Sandwich Islands
      
            </option>
      
            <option value="SS">South Sudan</option>
      
            <option value="ES">Spain</option>
      
            <option value="LK">Sri Lanka</option>
      
            <option value="SD">Sudan</option>
      
            <option value="SR">Suriname</option>
      
            <option value="SJ">Svalbard and Jan Mayen
      
            </option>
      
            <option value="SZ">Swaziland</option>
      
            <option value="SE">Sweden</option>
      
            <option value="CH">Switzerland</option>
      
            <option value="SY">Syrian Arab Republic
      
            </option>
      
            <option value="TW">Taiwan, Province of China
      
            </option>
      
            <option value="TJ">Tajikistan</option>
      
            <option value="TZ">Tanzania, United Republic of
      
            </option>
      
            <option value="TH">Thailand</option>
      
            <option value="TL">Timor-Leste</option>
      
            <option value="TG">Togo</option>
      
            <option value="TK">Tokelau</option>
      
            <option value="TO">Tonga</option>
      
            <option value="TT">Trinidad and Tobago
      
            </option>
      
            <option value="TN">Tunisia</option>
      
            <option value="TR">Turkey</option>
      
            <option value="TM">Turkmenistan</option>
      
            <option value="TC">Turks and Caicos Islands
      
            </option>
      
            <option value="TV">Tuvalu</option>
      
            <option value="UG">Uganda</option>
      
            <option value="UA">Ukraine</option>
      
            <option value="AE">United Arab Emirates
      
            </option>
      
            <option value="GB">United Kingdom
      
            </option>
      
            <option value="US">United States
      
            </option>
      
            <option value="UM">United States Minor Outlying Islands
      
            </option>
      
            <option value="UY">Uruguay</option>
      
            <option value="UZ">Uzbekistan</option>
      
            <option value="VU">Vanuatu</option>
      
            <option value="VE">Venezuela, Bolivarian Republic of
      
            </option>
      
            <option value="VN">Viet Nam</option>
      
            <option value="VG">Virgin Islands, British
      
            </option>
      
            <option value="VI">Virgin Islands, U.S.
      
            </option>
      
            <option value="WF">Wallis and Futuna
      
            </option>
      
            <option value="EH">Western Sahara
      
            </option>
      
            <option value="YE">Yemen</option>
      
            <option value="ZM">Zambia</option>
      
            <option value="ZW">Zimbabwe</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="education">Education</label>
      
          <input type="text" class="form-control" id="education" placeholder="Education">
      
        </div>
      
        <div class="form-group">
      
          <label for="skills">Skills</label>
      
          <input type="text" class="form-control" id="skills" placeholder="Skills">
      
        </div>
      
        <div class="form-group">
      
          <label for="linkedIn">My LinkedIn URL</label>
      
          <input type="text" class="form-control" id="linkedIn" placeholder="Your Link to Linked In">
      
        </div>
      
        <button type="submit" class="btn btn-primary">Create a Job 
      
              Profile</button>
      
        <!-- <button type="button" class="btn btn- 
      
                danger">Cancel</button> -->
      
      </form>
      
    </div>
      
  </div>
      
  <div class="col-xs-12">
      
    <div class="well">
      
      <div id="output">
      
        <!-- form input goes here -->
      
      </div>
      
      <!--  <button type="button" class="btn btn- 
      
              danger">Cancel</button> -->
      
    </div>
      
    <button type="button" class="btn btn-danger">Delete</button>
      
  </div>
      
  </div>
      
  <!-- </div> -->
      
  <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
      
  <script src="http://sabioapi2.azurewebsites.net/scripts/sabio.js">
      
  </script>
      
  <script type="text/javascript">
      
    sabio.page.startUp = function() {
      

      
      $('button[type="submit"]').on('click', sabio.page.handlers.writeHtml);
      

      

      
      $('button.btn-danger').on('click', sabio.page.hideCar);
      
    };
      
    sabio.page.handlers.writeHtml = function(event) {
      
      event.preventDefault();
      
      // $('#output').show();
      
      var name = $('#name').val();
      
      var headline = $('#headline').val();
      
      var position = $('#position').val();
      
      var spRegion = $('#spRegion').val();
      
      var country = $('#country').val();
      
      var education = $('#education').val();
      
      var skills = $('#skills').val();
      
      var linkedIn = $('#linkedIn').val();
      

      
      $('#output').html(
      
        '<ul style="list-style: none;">' +
      
        '<li>' + name + '</li>' +
      
        '<li> Headline:' + headline + '</li>' +
      
        '<li> Current Position:' + position + '</li>' +
      
        '<li> Location' + spRegion + '</li>' +
      
        '<li> Country' + country + '</li>' +
      
        '<li> Education:' + education + '</li>' +
      
        '<li> Skills:' + skills + '</li>' +
      
        '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
      
        '</ul>');
      
      // $('#output').append('<div><span>make:' +name+
      
      //                '</span></div><div><span>Headline: ' +headline+
      
      //                '</span></div><div><span>Current Position: ' +position+
      
      //                '</span></div><div><span>Location: ' +spRegion+
      
      //                '</span></div><div><span>Country: ' +country+
      
      //                '</span></div><div><span>Education: ' +edcation+
      
      //                '</span></div><div><span>Skills: ' +skills+
      
      //                '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
      
      //                );
      
      $('form')[0].reset();
      
    };
      
    sabio.page.hideCar = function() {
      
      $('#output').hide();
      
    };
      
  </script>
      
</body>
      

      
</html>





      <!DOCTYPE html>
      
<html>
      

      
<head>
      
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384- 
      
          BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      
  <title>Employee Profile</title>
      
</head>
      

      
<body>
      
  <div class="container">
      
    <div class="col-xs-6">
      
      <form>
      
        <div class="form-group">
      
          <label for="name">Full Name *</label>
      
          <input type="text" class="form-control" id="name" placeholder="Full Name" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="headline">Headline *</label>
      
          <input type="text" class="form-control" id="headline" placeholder="Headline" required>
      
        </div>
      
        <div class="form-group">
      
          <label for="position">Current Position</label>
      
          <input type="text" class="form-control" id="position" placeholder="Current Position">
      
        </div>
      
        <div class="form-group">
      
          <label for="spRegion">State/Province/Region * 
      
                </label>
      
          <select class="form-control" id="spRegion" required>
      
            <option>Please select</option>
      
            <option value="AL">Alabama</option>
      
            <option value="AK">Alaska</option>
      
            <option value="AZ">Arizona</option>
      
            <option value="AR">Arkansas</option>
      
            <option value="CA">California</option>
      
            <option value="CO">Colorado</option>
      
            <option value="CT">Connecticut</option>
      
            <option value="DE">Delaware</option>
      
            <option value="DC">District Of Columbia
      
            </option>
      
            <option value="FL">Florida</option>
      
            <option value="GA">Georgia</option>
      
            <option value="HI">Hawaii</option>
      
            <option value="ID">Idaho</option>
      
            <option value="IL">Illinois</option>
      
            <option value="IN">Indiana</option>
      
            <option value="IA">Iowa</option>
      
            <option value="KS">Kansas</option>
      
            <option value="KY">Kentucky</option>
      
            <option value="LA">Louisiana</option>
      
            <option value="ME">Maine</option>
      
            <option value="MD">Maryland</option>
      
            <option value="MA">Massachusetts</option>
      
            <option value="MI">Michigan</option>
      
            <option value="MN">Minnesota</option>
      
            <option value="MS">Mississippi</option>
      
            <option value="MO">Missouri</option>
      
            <option value="MT">Montana</option>
      
            <option value="NE">Nebraska</option>
      
            <option value="NV">Nevada</option>
      
            <option value="NH">New Hampshire</option>
      
            <option value="NJ">New Jersey</option>
      
            <option value="NM">New Mexico</option>
      
            <option value="NY">New York</option>
      
            <option value="NC">North Carolina</option>
      
            <option value="ND">North Dakota</option>
      
            <option value="OH">Ohio</option>
      
            <option value="OK">Oklahoma</option>
      
            <option value="OR">Oregon</option>
      
            <option value="PA">Pennsylvania</option>
      
            <option value="RI">Rhode Island</option>
      
            <option value="SC">South Carolina</option>
      
            <option value="SD">South Dakota</option>
      
            <option value="TN">Tennessee</option>
      
            <option value="TX">Texas</option>
      
            <option value="UT">Utah</option>
      
            <option value="VT">Vermont</option>
      
            <option value="VA">Virginia</option>
      
            <option value="WA">Washington</option>
      
            <option value="WV">West Virginia</option>
      
            <option value="WI">Wisconsin</option>
      
            <option value="WY">Wyoming</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="country">Country * </label>
      
          <select class="form-control" id="country" required>
      
            <option>Please select</option>
      
            <option value="AF">Afghanistan</option>
      
            <option value="AX">Åland Islands</option>
      
            <option value="AL">Albania</option>
      
            <option value="DZ">Algeria</option>
      
            <option value="AS">American Samoa</option>
      
            <option value="AD">Andorra</option>
      
            <option value="AO">Angola</option>
      
            <option value="AI">Anguilla</option>
      
            <option value="AQ">Antarctica</option>
      
            <option value="AG">Antigua and Barbuda
      
            </option>
      
            <option value="AR">Argentina</option>
      
            <option value="AM">Armenia</option>
      
            <option value="AW">Aruba</option>
      
            <option value="AU">Australia</option>
      
            <option value="AT">Austria</option>
      
            <option value="AZ">Azerbaijan</option>
      
            <option value="BS">Bahamas</option>
      
            <option value="BH">Bahrain</option>
      
            <option value="BD">Bangladesh</option>
      
            <option value="BB">Barbados</option>
      
            <option value="BY">Belarus</option>
      
            <option value="BE">Belgium</option>
      
            <option value="BZ">Belize</option>
      
            <option value="BJ">Benin</option>
      
            <option value="BM">Bermuda</option>
      
            <option value="BT">Bhutan</option>
      
            <option value="BO">Bolivia, Plurinational State of
      
            </option>
      
            <option value="BQ">Bonaire, Sint Eustatius and Saba
      
            </option>
      
            <option value="BA">Bosnia and Herzegovina
      
            </option>
      
            <option value="BW">Botswana</option>
      
            <option value="BV">Bouvet Island</option>
      
            <option value="BR">Brazil</option>
      
            <option value="IO">British Indian Ocean Territory
      
            </option>
      
            <option value="BN">Brunei Darussalam
      
            </option>
      
            <option value="BG">Bulgaria</option>
      
            <option value="BF">Burkina Faso</option>
      
            <option value="BI">Burundi</option>
      
            <option value="KH">Cambodia</option>
      
            <option value="CM">Cameroon</option>
      
            <option value="CA">Canada</option>
      
            <option value="CV">Cape Verde</option>
      
            <option value="KY">Cayman Islands
      
            </option>
      
            <option value="CF">Central African Republic
      
            </option>
      
            <option value="TD">Chad</option>
      
            <option value="CL">Chile</option>
      
            <option value="CN">China</option>
      
            <option value="CX">Christmas Island
      
            </option>
      
            <option value="CC">Cocos (Keeling) Islands
      
            </option>
      
            <option value="CO">Colombia</option>
      
            <option value="KM">Comoros</option>
      
            <option value="CG">Congo</option>
      
            <option value="CD">Congo, the Democratic Republic of the
      
            </option>
      
            <option value="CK">Cook Islands</option>
      
            <option value="CR">Costa Rica</option>
      
            <option value="CI">Côte d'Ivoire</option>
      
            <option value="HR">Croatia</option>
      
            <option value="CU">Cuba</option>
      
            <option value="CW">Curaçao</option>
      
            <option value="CY">Cyprus</option>
      
            <option value="CZ">Czech Republic
      
            </option>
      
            <option value="DK">Denmark</option>
      
            <option value="DJ">Djibouti</option>
      
            <option value="DM">Dominica</option>
      
            <option value="DO">Dominican Republic
      
            </option>
      
            <option value="EC">Ecuador</option>
      
            <option value="EG">Egypt</option>
      
            <option value="SV">El Salvador</option>
      
            <option value="GQ">Equatorial Guinea
      
            </option>
      
            <option value="ER">Eritrea</option>
      
            <option value="EE">Estonia</option>
      
            <option value="ET">Ethiopia</option>
      
            <option value="FK">Falkland Islands (Malvinas)
      
            </option>
      
            <option value="FO">Faroe Islands
      
            </option>
      
            <option value="FJ">Fiji</option>
      
            <option value="FI">Finland</option>
      
            <option value="FR">France</option>
      
            <option value="GF">French Guiana
      
            </option>
      
            <option value="PF">French Polynesia
      
            </option>
      
            <option value="TF">French Southern Territories
      
            </option>
      
            <option value="GA">Gabon</option>
      
            <option value="GM">Gambia</option>
      
            <option value="GE">Georgia</option>
      
            <option value="DE">Germany</option>
      
            <option value="GH">Ghana</option>
      
            <option value="GI">Gibraltar</option>
      
            <option value="GR">Greece</option>
      
            <option value="GL">Greenland</option>
      
            <option value="GD">Grenada</option>
      
            <option value="GP">Guadeloupe</option>
      
            <option value="GU">Guam</option>
      
            <option value="GT">Guatemala</option>
      
            <option value="GG">Guernsey</option>
      
            <option value="GN">Guinea</option>
      
            <option value="GW">Guinea- Bissau
      
            </option>
      
            <option value="GY">Guyana</option>
      
            <option value="HT">Haiti</option>
      
            <option value="HM">Heard Island and McDonald Islands
      
            </option>
      
            <option value="VA">Holy See (Vatican City State)
      
            </option>
      
            <option value="HN">Honduras</option>
      
            <option value="HK">Hong Kong</option>
      
            <option value="HU">Hungary</option>
      
            <option value="IS">Iceland</option>
      
            <option value="IN">India</option>
      
            <option value="ID">Indonesia</option>
      
            <option value="IR">Iran, Islamic Republic of
      
            </option>
      
            <option value="IQ">Iraq</option>
      
            <option value="IE">Ireland</option>
      
            <option value="IM">Isle of Man</option>
      
            <option value="IL">Israel</option>
      
            <option value="IT">Italy</option>
      
            <option value="JM">Jamaica</option>
      
            <option value="JP">Japan</option>
      
            <option value="JE">Jersey</option>
      
            <option value="JO">Jordan</option>
      
            <option value="KZ">Kazakhstan</option>
      
            <option value="KE">Kenya</option>
      
            <option value="KI">Kiribati</option>
      
            <option value="KP">Korea, Democratic People's Republic of
      
            </option>
      
            <option value="KR">Korea, Republic of
      
            </option>
      
            <option value="KW">Kuwait</option>
      
            <option value="KG">Kyrgyzstan</option>
      
            <option value="LA">Lao People's Democratic Republic
      
            </option>
      
            <option value="LV">Latvia</option>
      
            <option value="LB">Lebanon</option>
      
            <option value="LS">Lesotho</option>
      
            <option value="LR">Liberia</option>
      
            <option value="LY">Libya</option>
      
            <option value="LI">Liechtenstein</option>
      
            <option value="LT">Lithuania</option>
      
            <option value="LU">Luxembourg</option>
      
            <option value="MO">Macao</option>
      
            <option value="MK">Macedonia, the former Yugoslav Republic of
      
            </option>
      
            <option value="MG">Madagascar</option>
      
            <option value="MW">Malawi</option>
      
            <option value="MY">Malaysia</option>
      
            <option value="MV">Maldives</option>
      
            <option value="ML">Mali</option>
      
            <option value="MT">Malta</option>
      
            <option value="MH">Marshall Islands
      
            </option>
      
            <option value="MQ">Martinique</option>
      
            <option value="MR">Mauritania</option>
      
            <option value="MU">Mauritius</option>
      
            <option value="YT">Mayotte</option>
      
            <option value="MX">Mexico</option>
      
            <option value="FM">Micronesia, Federated States of
      
            </option>
      
            <option value="MD">Moldova, Republic of
      
            </option>
      
            <option value="MC">Monaco</option>
      
            <option value="MN">Mongolia</option>
      
            <option value="ME">Montenegro</option>
      
            <option value="MS">Montserrat</option>
      
            <option value="MA">Morocco</option>
      
            <option value="MZ">Mozambique</option>
      
            <option value="MM">Myanmar</option>
      
            <option value="NA">Namibia</option>
      
            <option value="NR">Nauru</option>
      
            <option value="NP">Nepal</option>
      
            <option value="NL">Netherlands</option>
      
            <option value="NC">New Caledonia
      
            </option>
      
            <option value="NZ">New Zealand</option>
      
            <option value="NI">Nicaragua</option>
      
            <option value="NE">Niger</option>
      
            <option value="NG">Nigeria</option>
      
            <option value="NU">Niue</option>
      
            <option value="NF">Norfolk Island
      
            </option>
      
            <option value="MP">Northern Mariana Islands
      
            </option>
      
            <option value="NO">Norway</option>
      
            <option value="OM">Oman</option>
      
            <option value="PK">Pakistan</option>
      
            <option value="PW">Palau</option>
      
            <option value="PS">Palestinian Territory, Occupied
      
            </option>
      
            <option value="PA">Panama</option>
      
            <option value="PG">Papua New Guinea
      
            </option>
      
            <option value="PY">Paraguay</option>
      
            <option value="PE">Peru</option>
      
            <option value="PH">Philippines</option>
      
            <option value="PN">Pitcairn</option>
      
            <option value="PL">Poland</option>
      
            <option value="PT">Portugal</option>
      
            <option value="PR">Puerto Rico</option>
      
            <option value="QA">Qatar</option>
      
            <option value="RE">Réunion</option>
      
            <option value="RO">Romania</option>
      
            <option value="RU">Russian Federation
      
            </option>
      
            <option value="RW">Rwanda</option>
      
            <option value="BL">Saint Barthélemy
      
            </option>
      
            <option value="SH">Saint Helena, Ascension and Tristan da Cunha
      
            </option>
      
            <option value="KN">Saint Kitts and Nevis
      
            </option>
      
            <option value="LC">Saint Lucia</option>
      
            <option value="MF">Saint Martin (French part)
      
            </option>
      
            <option value="PM">Saint Pierre and Miquelon
      
            </option>
      
            <option value="VC">Saint Vincent and the Grenadines
      
            </option>
      
            <option value="WS">Samoa</option>
      
            <option value="SM">San Marino</option>
      
            <option value="ST">Sao Tome and Principe
      
            </option>
      
            <option value="SA">Saudi Arabia
      
            </option>
      
            <option value="SN">Senegal</option>
      
            <option value="RS">Serbia</option>
      
            <option value="SC">Seychelles</option>
      
            <option value="SL">Sierra Leone
      
            </option>
      
            <option value="SG">Singapore</option>
      
            <option value="SX">Sint Maarten (Dutch part)
      
            </option>
      
            <option value="SK">Slovakia</option>
      
            <option value="SI">Slovenia</option>
      
            <option value="SB">Solomon Islands
      
            </option>
      
            <option value="SO">Somalia</option>
      
            <option value="ZA">South Africa
      
            </option>
      
            <option value="GS">South Georgia and the South Sandwich Islands
      
            </option>
      
            <option value="SS">South Sudan</option>
      
            <option value="ES">Spain</option>
      
            <option value="LK">Sri Lanka</option>
      
            <option value="SD">Sudan</option>
      
            <option value="SR">Suriname</option>
      
            <option value="SJ">Svalbard and Jan Mayen
      
            </option>
      
            <option value="SZ">Swaziland</option>
      
            <option value="SE">Sweden</option>
      
            <option value="CH">Switzerland</option>
      
            <option value="SY">Syrian Arab Republic
      
            </option>
      
            <option value="TW">Taiwan, Province of China
      
            </option>
      
            <option value="TJ">Tajikistan</option>
      
            <option value="TZ">Tanzania, United Republic of
      
            </option>
      
            <option value="TH">Thailand</option>
      
            <option value="TL">Timor-Leste</option>
      
            <option value="TG">Togo</option>
      
            <option value="TK">Tokelau</option>
      
            <option value="TO">Tonga</option>
      
            <option value="TT">Trinidad and Tobago
      
            </option>
      
            <option value="TN">Tunisia</option>
      
            <option value="TR">Turkey</option>
      
            <option value="TM">Turkmenistan</option>
      
            <option value="TC">Turks and Caicos Islands
      
            </option>
      
            <option value="TV">Tuvalu</option>
      
            <option value="UG">Uganda</option>
      
            <option value="UA">Ukraine</option>
      
            <option value="AE">United Arab Emirates
      
            </option>
      
            <option value="GB">United Kingdom
      
            </option>
      
            <option value="US">United States
      
            </option>
      
            <option value="UM">United States Minor Outlying Islands
      
            </option>
      
            <option value="UY">Uruguay</option>
      
            <option value="UZ">Uzbekistan</option>
      
            <option value="VU">Vanuatu</option>
      
            <option value="VE">Venezuela, Bolivarian Republic of
      
            </option>
      
            <option value="VN">Viet Nam</option>
      
            <option value="VG">Virgin Islands, British
      
            </option>
      
            <option value="VI">Virgin Islands, U.S.
      
            </option>
      
            <option value="WF">Wallis and Futuna
      
            </option>
      
            <option value="EH">Western Sahara
      
            </option>
      
            <option value="YE">Yemen</option>
      
            <option value="ZM">Zambia</option>
      
            <option value="ZW">Zimbabwe</option>
      
          </select>
      
        </div>
      
        <div class="form-group">
      
          <label for="education">Education</label>
      
          <input type="text" class="form-control" id="education" placeholder="Education">
      
        </div>
      
        <div class="form-group">
      
          <label for="skills">Skills</label>
      
          <input type="text" class="form-control" id="skills" placeholder="Skills">
      
        </div>
      
        <div class="form-group">
      
          <label for="linkedIn">My LinkedIn URL</label>
      
          <input type="text" class="form-control" id="linkedIn" placeholder="Your Link to Linked In">
      
        </div>
      
        <button type="submit" class="btn btn-primary">Create a Job 
      
              Profile</button>
      
        <!-- <button type="button" class="btn btn- 
      
                danger">Cancel</button> -->
      
      </form>
      
    </div>
      
  </div>
      
  <div class="col-xs-12">
      
    <div class="well">
      
      <div id="output">
      
        <!-- form input goes here -->
      
      </div>
      
      <!--  <button type="button" class="btn btn- 
      
              danger">Cancel</button> -->
      
    </div>
      
    <button type="button" class="btn btn-danger">Delete</button>
      
  </div>
      
  </div>
      
  <!-- </div> -->
      
  <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
      
  <script src="http://sabioapi2.azurewebsites.net/scripts/sabio.js">
      
  </script>
      
  <script type="text/javascript">
      
    sabio.page.startUp = function() {
      

      
      $('button[type="submit"]').on('click', sabio.page.handlers.writeHtml);
      

      

      
      $('button.btn-danger').on('click', sabio.page.hideCar);
      
    };
      
    sabio.page.handlers.writeHtml = function(event) {
      
      event.preventDefault();
      
      // $('#output').show();
      
      var name = $('#name').val();
      
      var headline = $('#headline').val();
      
      var position = $('#position').val();
      
      var spRegion = $('#spRegion').val();
      
      var country = $('#country').val();
      
      var education = $('#education').val();
      
      var skills = $('#skills').val();
      
      var linkedIn = $('#linkedIn').val();
      

      
      $('#output').html(
      
        '<ul style="list-style: none;">' +
      
        '<li>' + name + '</li>' +
      
        '<li> Headline:' + headline + '</li>' +
      
        '<li> Current Position:' + position + '</li>' +
      
        '<li> Location' + spRegion + '</li>' +
      
        '<li> Country' + country + '</li>' +
      
        '<li> Education:' + education + '</li>' +
      
        '<li> Skills:' + skills + '</li>' +
      
        '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
      
        '</ul>');
      
      // $('#output').append('<div><span>make:' +name+
      
      //                '</span></div><div><span>Headline: ' +headline+
      
      //                '</span></div><div><span>Current Position: ' +position+
      
      //                '</span></div><div><span>Location: ' +spRegion+
      
      //                '</span></div><div><span>Country: ' +country+
      
      //                '</span></div><div><span>Education: ' +edcation+
      
      //                '</span></div><div><span>Skills: ' +skills+
      
      //                '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
      
      //                );
      
      $('form')[0].reset();
      
    };
      
    sabio.page.hideCar = function() {
      
      $('#output').hide();
      
    };
      
  </script>
      
</body>
      

      
</html>





      javascript




      javascript






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 25 '18 at 0:53









      Danny Fardy Jhonston Bermúdez

      4,90951833




      4,90951833










      asked Nov 25 '18 at 0:50









      Shahid IslamShahid Islam

      61




      61
























          1 Answer
          1






          active

          oldest

          votes


















          0














          from your question, i think this is what you want. Close up your output div (remove the comments) <div id="output"></div>
          and use an if else for your js code



          if (!$('#output').html().length) {
          
  $('#output').html(
          
    '<ul style="list-style: none;">' +
          
    '<li>' + name + '</li>' +
          
    '<li> Headline:' + headline + '</li>' +
          
    '<li> Current Position:' + position + '</li>' +
          
    '<li> Location' + spRegion + '</li>' +
          
    '<li> Country' + country + '</li>' +
          
    '<li> Education:' + education + '</li>' +
          
    '<li> Skills:' + skills + '</li>' +
          
    '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
          
    '</ul>');
          

          
}else{
          
  $('#output').append('<div><span>make:' +name+
          
                 '</span></div><div><span>Headline: ' +headline+
          
                 '</span></div><div><span>Current Position: ' +position+
          
                 '</span></div><div><span>Location: ' +spRegion+
          
                 '</span></div><div><span>Country: ' +country+
          
                 '</span></div><div><span>Education: ' +education+
          
                 '</span></div><div><span>Skills: ' +skills+
          
                 '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
          
                 );}





          share|improve this answer























            Your Answer






            StackExchange.ifUsing("editor", function () {
            StackExchange.using("externalEditor", function () {
            StackExchange.using("snippets", function () {
            StackExchange.snippets.init();
            });
            });
            }, "code-snippets");

            StackExchange.ready(function() {
            var channelOptions = {
            tags: "".split(" "),
            id: "1"
            };
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function() {
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled) {
            StackExchange.using("snippets", function() {
            createEditor();
            });
            }
            else {
            createEditor();
            }
            });

            function createEditor() {
            StackExchange.prepareEditor({
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader: {
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            },
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            });


            }
            });














            draft saved

            draft discarded


















            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53463747%2fi-cannot-make-a-running-list-with-the-following-javascript-code%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            0














            from your question, i think this is what you want. Close up your output div (remove the comments) <div id="output"></div>
            and use an if else for your js code



            if (!$('#output').html().length) {
            
  $('#output').html(
            
    '<ul style="list-style: none;">' +
            
    '<li>' + name + '</li>' +
            
    '<li> Headline:' + headline + '</li>' +
            
    '<li> Current Position:' + position + '</li>' +
            
    '<li> Location' + spRegion + '</li>' +
            
    '<li> Country' + country + '</li>' +
            
    '<li> Education:' + education + '</li>' +
            
    '<li> Skills:' + skills + '</li>' +
            
    '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
            
    '</ul>');
            

            
}else{
            
  $('#output').append('<div><span>make:' +name+
            
                 '</span></div><div><span>Headline: ' +headline+
            
                 '</span></div><div><span>Current Position: ' +position+
            
                 '</span></div><div><span>Location: ' +spRegion+
            
                 '</span></div><div><span>Country: ' +country+
            
                 '</span></div><div><span>Education: ' +education+
            
                 '</span></div><div><span>Skills: ' +skills+
            
                 '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
            
                 );}





            share|improve this answer




























              0














              from your question, i think this is what you want. Close up your output div (remove the comments) <div id="output"></div>
              and use an if else for your js code



              if (!$('#output').html().length) {
              
  $('#output').html(
              
    '<ul style="list-style: none;">' +
              
    '<li>' + name + '</li>' +
              
    '<li> Headline:' + headline + '</li>' +
              
    '<li> Current Position:' + position + '</li>' +
              
    '<li> Location' + spRegion + '</li>' +
              
    '<li> Country' + country + '</li>' +
              
    '<li> Education:' + education + '</li>' +
              
    '<li> Skills:' + skills + '</li>' +
              
    '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
              
    '</ul>');
              

              
}else{
              
  $('#output').append('<div><span>make:' +name+
              
                 '</span></div><div><span>Headline: ' +headline+
              
                 '</span></div><div><span>Current Position: ' +position+
              
                 '</span></div><div><span>Location: ' +spRegion+
              
                 '</span></div><div><span>Country: ' +country+
              
                 '</span></div><div><span>Education: ' +education+
              
                 '</span></div><div><span>Skills: ' +skills+
              
                 '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
              
                 );}





              share|improve this answer


























                0












                0








                0







                from your question, i think this is what you want. Close up your output div (remove the comments) <div id="output"></div>
                and use an if else for your js code



                if (!$('#output').html().length) {
                
  $('#output').html(
                
    '<ul style="list-style: none;">' +
                
    '<li>' + name + '</li>' +
                
    '<li> Headline:' + headline + '</li>' +
                
    '<li> Current Position:' + position + '</li>' +
                
    '<li> Location' + spRegion + '</li>' +
                
    '<li> Country' + country + '</li>' +
                
    '<li> Education:' + education + '</li>' +
                
    '<li> Skills:' + skills + '</li>' +
                
    '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
                
    '</ul>');
                

                
}else{
                
  $('#output').append('<div><span>make:' +name+
                
                 '</span></div><div><span>Headline: ' +headline+
                
                 '</span></div><div><span>Current Position: ' +position+
                
                 '</span></div><div><span>Location: ' +spRegion+
                
                 '</span></div><div><span>Country: ' +country+
                
                 '</span></div><div><span>Education: ' +education+
                
                 '</span></div><div><span>Skills: ' +skills+
                
                 '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
                
                 );}





                share|improve this answer













                from your question, i think this is what you want. Close up your output div (remove the comments) <div id="output"></div>
                and use an if else for your js code



                if (!$('#output').html().length) {
                
  $('#output').html(
                
    '<ul style="list-style: none;">' +
                
    '<li>' + name + '</li>' +
                
    '<li> Headline:' + headline + '</li>' +
                
    '<li> Current Position:' + position + '</li>' +
                
    '<li> Location' + spRegion + '</li>' +
                
    '<li> Country' + country + '</li>' +
                
    '<li> Education:' + education + '</li>' +
                
    '<li> Skills:' + skills + '</li>' +
                
    '<li>' + linkedIn + '<a href="https://www.something.com">LinkedIn Profile</a>' + '</li>' +
                
    '</ul>');
                

                
}else{
                
  $('#output').append('<div><span>make:' +name+
                
                 '</span></div><div><span>Headline: ' +headline+
                
                 '</span></div><div><span>Current Position: ' +position+
                
                 '</span></div><div><span>Location: ' +spRegion+
                
                 '</span></div><div><span>Country: ' +country+
                
                 '</span></div><div><span>Education: ' +education+
                
                 '</span></div><div><span>Skills: ' +skills+
                
                 '</span></div><div><span>LinkedIn: ' +linkedIn+'<a href="https://www.something.com">LinkedIn Profile</a>'
                
                 );}






                share|improve this answer












                share|improve this answer



                share|improve this answer










                answered Nov 25 '18 at 4:25









                LysLys

                515




                515






























                    draft saved

                    draft discarded




















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid …



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53463747%2fi-cannot-make-a-running-list-with-the-following-javascript-code%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    -

                    Popular posts from this blog

                    Lallio

                    Image
                    Coordenadas: 45° 40' N 9° 38' E Lallio      Comuna    Lallio Localização de Lallio na Itália Coordenadas 45° 40' N 9° 38' E Região Lombardia Província Bérgamo Área - Total 2 km² Altitude 216 m População  - Total 3 826     • Densidade 1 913 hab./km² Outros dados Comunas limítrofes Bergamo, Dalmine, Stezzano, Treviolo Código ISTAT 016123 Código cadastral E422 Código postal 24040 Prefixo telefônico 035 Website www.comune.lallio.bg.it Lallio é uma comuna italiana da região da Lombardia, província de Bérgamo, com cerca de 3.826 habitantes. Estende-se por uma área de 2 km², tendo uma densidade populacional de 1913 hab/km². Faz fronteira com Bergamo, Dalmine, Stezzano, Treviolo. [ 1 ] [ 2 ] [ 3 ] Demografia | Variação demográfica do município entre 1861 e 2011 [ 3 ] Fonte : Istituto Nazionale di Statistica (ISTAT) - Elabor...
                    Read more

                    Unable to find Lightning Node

                    Image
                    2 I have successfully installed and synced my lightning node (Raspiblitz). I see my public ip on port 8333 has 8 conns. However, when I check my node on 1ml.com my node is not found. I did forward port 8333 and 9735 on my router. Should I connect to a peer or create a channel before my node is visible for the outside? lightning-network lightning-network-daemon share | improve this question asked 1 hour ago Bart DV Bart DV 31 3 add a comment  |  ...
                    Read more

                    Futebolista

                    Image
                    Ronaldo primeiro jogador a ser eleito por três vezes o melhor jogador do mundo pela FIFA. Ronaldinho Gaúcho atuando pelo Barcelona onde foi duas vezes eleito o melhor jogador do mundo pela FIFA. Kaká atuando pelo Milan onde foi eleito em 2007 o melhor jogador do mundo pela FIFA. Lothar Matthäus primeiro jogador a ser eleito o melhor jogador do mundo pela FIFA em 1991 pela Inter de Milão. Neymar durante partida contra a Escócia, em 27 de março de 2011. Crianças praticando futebol. Robinho, futebolista brasileiro, em 15 de novembro de 2006. Atletas do Chelsea, da Inglaterra. A venda de camisas com nome e número dos jogadores é uma grande fonte de arrecadação. Jürgen Klinsmann atuou como jogador e foi treinador da Alemanha. Estádio de futebol, principal local onde laboram os jogadores. O jogador de futebol , ou Futebolista , é um atleta profissional de futebol, e cuja prática do desporto coletivo é fundamental. Estes trabalhadores sã...
                    Read more