Добавление ссылки с существующим href

Question

Im пытается создать ссылку внутри моего тега списка, которая будет иметь href, унаследованную от ссылки, которая уже существует в этом теге списка. Не знаю, как много смысла это делает, но у меня есть это:

<ul> 
    <li><a href="page1.html">Support</a></li> 
    <li><a href="page2.html">Products</a></li> 
    <li><a href="page3.html">Management</a></li> 
    <li><a href="page4.html">Others</a></li> 
</ul> 

и мне нужно успокаивать, как это:

<ul> 
    <li> 
     <a href="page1.html">Support</a> 
     <div class="slideLink"><a href="page1.html">Click Here</a></div> 
    </li> 
    <li> 
     <a href="page2.html">Products</a> 
     <div class="slideLink"><a href="page2.html">Click Here</a></div> 
    </li> 
    <li> 
     <a href="page3.html">Management</a> 
     <div class="slideLink"><a href="page3.html">Click Here</a></div> 
    </li> 
    <li> 
     <a href="page4.html">Others</a> 
     <div class="slideLink"><a href="page4.html">Click Here</a></div> 
    </li> 
</ul> 

До сих пор я сумел добавить DIV с классом и ссылку в он с текстом «нажмите здесь», но я не знаю, как захватить ссылку href и добавить ее в мою новую ссылку.

$('ul li a').each(function(){ 
    $(this).after("<div class='slideLink'><a href=" + Link + ">Read more</div>"); 
    }); 

Благодарим за помощь.

С наилучшими пожеланиями

Dom

Answer 1

$('ul li a').each(function(){ 
    var link = $(this).attr('href'); 
    $(this).after("<div class='slideLink'><a href=" + link + ">Read more</div>"); 
}); 

Answer 2

$('ul li a').each(function(){ 
    var $div = $("<div class='slideLink'></div>"); 
    var $link = $("<a></a>").attr("href", $(this).attr("href")) 
          .text("Click Here"); 
    $div.append($link); 
    $(this).after($div); 
});