¿Cómo insertar una imagen en algún html a través de JQuery?

Question

Aquí está la situación. Tengo un enlace estándar así:

<h2><a href="#">Link Title</a></h2>

Ahora, quiero insertar un fondo para que se vea como un botón, así que agrego un lapso con JQuery así:

$(document).ready(function()
{
      $(".post a").wrapInner("<span></span>");
});

(El html para el enlace se puede encontrar aquí, http://flickrental.co.uk/ - Por cierto, este no es el sitio, solo el código del enlace)

Ahora puedo transformar el enlace en un botón " " mejor " y estoy muy contento ... Pero tuve otra idea, qué pasaría si pudiera agregar una pequeña imagen de flecha dentro del enlace (a la derecha del texto) (este sitio es un sitio afiliado y el botón debería aumentar el CTR como así como la imagen de la flecha)

Pero parece que no puedo encontrar la sintaxis correcta para hacer esto.

¿Alguna idea?

Answer 1

Probablemente debería agregar la flecha con css. Dada una flecha de 10 píxeles de ancho:

.post a {
    padding-right: 10px;
    background: url(arrow.png) no-repeat right 50%;
}

Pero si ya está utilizando la imagen de fondo para otra cosa, puede agregar la imagen con jquery:

$("<img src='arrow.png'/>").prependTo(".post a");

Supongo que, según tu pregunta, no tienes acceso para cambiar el HTML directamente. De lo contrario, esa sería probablemente la mejor solución.