Question

I tried this way but it didn’t work:

  var imglunch = new Image();
  imglunch.src = "../images/faciliteit_lunch.png";
  var imgdiner = new Image();
  imgdiner.src = "../images/faciliteit_diner.png";
  $('.greenfluxlist').append('<li id="' + element.Identifier + '"><a href="bla.html" rel="external">' + imglunch + imgdiner + '</a></li>');

Anyone know how to add it?

Answer 1

Simply let’s use the jQuery function to create your img elements:

var imglunch = $( '<img />' );
imglunch.attr( 'src', '../images/faciliteit_lunch.png' );

var imgdiner = $( '<img />' );
imgdiner.attr( 'src', '../images/faciliteit_diner.png' );

$('.greenfluxlist').append('<li id="' + element.Identifier + '"><a href="bla.html" rel="external"></a></li>');
$( '#' + element.Identifier + ' > a' ).append( imglunch ).append( imgdiner ); 

Or you can append your html code all in once:

$('.greenfluxlist').append('<li id="' + element.Identifier + '"><a href="bla.html" rel="external"><img src="../images/faciliteit_lunch.png" /><img src="../images/faciliteit_diner.png" /></a></li>');