I've a function 'refreshDisplay' which will help me create dynamic elements. Now, I've a small condition there. In the 'src' attribute of the image, I'm going to check if the obj.picture.thumbnail starts with '/content' then append  '.jpg'  to the end of the obj.picture.thumbnail's value , else just use obj.picture.thumbnails' value!

Please check the image with class '.myLink' in the code. How do I achieve this?

Here's the code.

function refreshDisplay() { $('.container').html(''); savedData.forEach(function (obj) { // Reset container, and append collected data (use jQuery for appending) $('.container').append( $('<div>').addClass('parent').append( $('<label>').addClass('dataLabel').text('Name: '), obj.name.first + ' ' + obj.name.last, $('<br>'), // line-break between name & pic $('<img>').addClass('myLink').attr('src', obj.picture.thumbnail), $('<br>'), $('<label>').addClass('dataLabel').text('Date of birth: '), obj.dob, $('<br>'), $('<label>').addClass('dataLabel').text('Address: '), $('<br>'), obj.location.street, $('<br>'), obj.location.city + ' ' + obj.location.postcode, $('<br>'), obj.location.state, $('<br>'), $('<button>').addClass('removeMe').text('Delete'), $('<button>').addClass('top-btn').text('Swap with top'), $('<button>').addClass('down-btn').text('Swap with down') ) ); }) // Clear checkboxes: $('.selectRow').prop('checked', false); handleEvents(); }