GOAL: Switch out an image on a webpage based off of a select dropdown option. [HTML + JavaScript]
CODE
<select onchange="$('#imageToSwap').attr('src', this.options[this.selectedIndex].value);">
<option value="http://cdns2.freepik.com/free-photo/facebook-logo_318- 49940.jpg" selected>Facebook</option>
<option value="http://cdns2.freepik.com/free-photo/twitter-logo_318-
40459.jpg">Twitter</option>
<option value="http://cdns2.freepik.com/free-photo/instagram-social-network- logo-of-photo-camera_318-64651.jpg">Instagram</option>
</select>
<img id="imageToSwap" class="profile" src="http://cdns2.freepik.com/free-photo/facebook-logo_318-49940.jpg">
DEMO
CODE
<select onchange="$('#imageToSwap').attr('src', this.options[this.selectedIndex].value);">
<option value="http://cdns2.freepik.com/free-photo/facebook-logo_318- 49940.jpg" selected>Facebook</option>
<option value="http://cdns2.freepik.com/free-photo/twitter-logo_318-
40459.jpg">Twitter</option>
<option value="http://cdns2.freepik.com/free-photo/instagram-social-network- logo-of-photo-camera_318-64651.jpg">Instagram</option>
</select>
<img id="imageToSwap" class="profile" src="http://cdns2.freepik.com/free-photo/facebook-logo_318-49940.jpg">
DEMO