Stef Stef - 4 months ago 14
PHP Question

jQuery: disabling an anchor and creating a new one with the same href

I'm using a Wordpress plugin for loading Facebook events into a web page. There is a big anchor with an event div in it. I want a small anchor at the bottom of every fb-event div instead.

I need to:

Disable the first anchor without removing it (removing it would also remove the entire div).

Create a new anchor at the bottom of the fb-event div.

Pass the href from the first anchor to the second.

I feel like I'm pretty close but nothing happens, this is my code, first html, then jQuery. Thanks in advance!

<div class='fb-event'>
<a class="fb-event-anchor" href="" target="_blank">
<div class="fb-event-desc"><img src= />
<div class='fb-event-title'>Spiritueel weekend - Een stapje verder</div>
<div class='fb-event-time'>10 september 2016 &#183; 10:00 -<br>11 september 2016 &#183; 17:00</div>
<div class='fb-event-location'>Balance in Life</div>
<div class='fb-event-description'>Lots


var fblink = $('.fb-event-anchor').attr('href');

return false; // prevents default action
$('.fb-event-description').append('<a class="fb-event-anchor-new" href="' . [fblink] . '"></a>');


Try with below code

$(function () {
    $('.fb-event-anchor').on("click", function (e) {

var fblink = $('.fb-event-anchor').attr("href");
    $( ".fb-event" ).append( '<a class="fb-event-anchor-new" href='+ fblink +'>NEW LINK</a>' );