Как использовать JQuery для изменения значения одного атрибута html равным значению другого атрибута?

Question

С JQuery при загрузке документа я пытаюсь выбрать каждый <img> и дать ему новый атрибут title и установить его равным значению атрибута alt. title - это то, что должно появиться во всплывающей подсказке, когда пользователь нависает над элементом. Используя консоль, я, кажется, могу эффективно выбирать каждый элемент, но что-то кажется неправильным, когда я все это собираю.

HTML-:

<ul class="list"> 

<li><img href="#" src="url" data-toggle="tooltip" data-placement="right" alt="first-tooltip"></li> 

<li><img href="#" src="url" data-toggle="tooltip" data-placement="right" alt="second-tooltip"></li> 

<li><img href="#" src="url" data-toggle="tooltip" data-placement="right" alt="third-tooltip"></li> 

</ul> 

JS:

$(document).ready(function(){ 
    $('[data-toggle="tooltip"]').tooltip(); //enable tooltips 

    $('.list li').children().each(function(){ //perform function on each <a> 
     var thisAltText = $(this).attr('alt'); //select the alt value 
     $(this).attr('title', thisAltText); //set title value to equal alt value 
    }); 
}); 

Как вы можете видеть, это не работает: http://codepen.io/shawnmurtagh/pen/ZpVgkz

FYI - Я использую .children(), потому что мне нужно выбрать разные элементы списка в моем фактическом проекте.

Answer 1

Попробуйте как этот

$(".list li").each(function() { 
    var thisAltText = $(this).children().attr('alt'); 
    $(this).children().attr('title', thisAltText); 
}); 

Или

$(".list li a").each(function(index) { 
    var thisAltText = $(this).attr('alt'); 
    $(this).attr('title', thisAltText); 
}); 

Или

$(".list li").each(function(index) { 
    var thisAltText = $(this).find('img').attr('alt'); 
    $(this).find('img').attr('title', thisAltText); 
}); 

Или

$(".list").children().each(function(index) { 
    var thisAltText = $(this).find('img').attr('alt'); 
    $(this).find('img').attr('title', thisAltText); 
}); 

Играть здесь https://jsfiddle.net/47jgmzju/

Answer 2

Делают это так:

$(document).ready(function(){ 
     $('.list li').children().each(function(){ //perform function on each <a> 
      var thisAltText = $(this).attr('alt'); //select the alt value 
      $(this).attr('title', thisAltText); //set title value to equal alt value 
     }); 
     $('[data-toggle="tooltip"]').tooltip(); //enable tooltips 
    });