How to load image into bootstrap modal with javascript

Question

My setup is 4 links (below). I want each link to open myModal, but depending on which link gets clicked, a different image file should load in the modal. I got it working for

Answer 1

By using jquery .click you can easily achieve this (with html5 data attribute too).

    
6 Teams
    
    
5 Teams
    
    
4 Teams
    
    
3 Teams
    

Script:

$('li a').click(function (e) {
    $('#myModal img').attr('src', $(this).attr('data-img-url'));
});

Fiddle: http://jsfiddle.net/vLSWH/292/

Note: Though you did not specify using jQuery, twitter-bootstrap modal require you to use jQuery anyway, so might as well use it.