javascript - jqueryを使用してdiv内にテキストリンクを追加する方法は?

Question

div内にリンクとしてテキストを配置したい。

たとえば、<a href="http://www.google.com"クラス ID が「my-link」の div 内にハイパーリンクを含むテキスト「Google」を配置したいとします。

jqueryまたはjavascriptを使用してこれを行うにはどうすればよいですか?

Answer 1

クラスと ID は同じではありません。

IDの場合、これを試してください：

$('#my-link').html('<a href="http://www.google.com">Google</a>');

ID付きデモ

クラスの場合、これを試してください：

$('.my-link').html('<a href="http://www.google.com">Google</a>');
   ^

クラスでのデモ

Answer 2

あなたはこれを行うことができます ：

$('.my-link').html('<a href="http://www.google.com">Google</a>');

ただし、すべての.my-link div にハイパーリンクが追加されるため、 IDを divに追加し、jQueryコードでIDを使用することをお勧めします。

Answer 3

my-linkがターゲット div のクラスである場合

$('.my-link').html(function(idx, html){
    return html.replace(/Google/g, '<a href="http://www.google.com">Google</a>')
})

デモ:フィドル