Как мне добавить атрибуты к моим изображениям с помощью javascript?

Я хотел бы знать, как я могу добавить атрибуты изображения в следующий код. Я добавил функцию teest, чтобы узнать, поддерживает ли браузер пользователей изображение webp, а если нет, он просто показывает изображение jpg вместо webp, но я хочу добавить атрибуты, и ничего из того, что я сделал, не работает.

function hasWebP() {
  var rv = $.Deferred();
  var img = new Image();
  img.onload = function() { rv.resolve(); };
  img.onerror = function() { rv.reject(); };
  img.src = '/images/home/dot.webp';
  return rv.promise();
}
hasWebP().then(function() {
    var img=document.createElement("img");
    img.src = "images/home/IMG_4389.webp";
    img.id = "picture";
    var foo = document.getElementById("myFace");
    foo.appendChild(img);
}, function() {
    var img=document.createElement("img");
    img.src = "images/home/IMG_4389.png";
    img.id = "picture2";
    var foo = document.getElementById("myFace");
    foo.appendChild(img);
});