Création de liens pour les éléments avec une classe particulière avec jQuery

Question

Comment est-ce que je peux emballer chaque élément appartenant à une classe particulière avec un lien qui est construit à partir du texte à l'intérieur de la div? Ce que je veux dire est que je voudrais tourner:

<foo class="my-class>sometext</foo> 

dans

<a href="path/sometext" ><foo class="my-class>sometext</foo></a> 

caractères de codage Url serait aussi bien, mais peut être ignoré pour l'instant si nécessaire.

EDIT: Juste pour préciser, le chemin dépend du texte dans l'élément

Answer 1

Utilisez jQuery.wrap() pour le cas simple:

$(".my-class").wrap("<a href='path/sometext'></a>"); 

Pour traiter du texte à l'intérieur:

$(".my-class").each(function() { 
    var txt = $(this).text(); 
    var link = $("<a></a>").attr("href", "path/" + txt); 
    $(this).wrap(link[0]); 
}); 

Answer 2

$(".my-class").each(function(){ 
    var thisText = $(this).text(); 
    $(this).wrap("<a></a>").attr("href","path/"+thisText); 
}); 

Answer 3

vous pouvez les emballer insi de l'élément d'ancrage comme celui-ci:

$(document).ready(function(){ 
    $(".my-class").each(function(){ 
      var hr="path/"+$(this).text(); 
      $(this).wrap("<a href='"+hr+"'></a>"); 
    }); 
}); 

si vous ouvrez des liens dans la même page elle-même alors de manière plus facile que de modifier dom pour envelopper des éléments à l'intérieur de l'ancre est de définir css pour les éléments afin qu'ils ressemblent à des liens puis gérer cliquez sur l'événement :

$(".my-class").click(function(){ 
    window.location.href="path/"+$(this).text(); 
}); 

Answer 4

cela devrait le faire:

$('foo.my-class').each(function() { 
    var element = $(this); 
    var text = element.html(); // or .text() or .val() 
    element.wrap('<a href="path/' + text + '"></a>'); 
}); 

Answer 5

$("foo.my-class").each(function(){ 
    var foo = $(this); 
    foo.wrap("<a href='path/" + foo.Text() +"'>"); 
});