javascript - Append Div Class to Hyperlink Class — then Clone & Append Hyperlink To Container on Click -


  1. i want append div class ('.link-cloner') hyperlink class ('.link') when hover on any hyperlink (that has '.link' class).
  2. then when click on appended (.link-cloner) class, want clone hyperlink appended to, , append (link) #container.

i'm there, can't make last part work.

codepen: http://codepen.io/strengthandfreedom/pen/jxeeqp/

i tried using find(), closest() & $(this) in various combinations, can't make clone hyperlink (not linkcloner) , append #container.

jquery:

$(document).ready(function(e) {   /* ------------------------     part 1 — works   --------------------------*/   // store link-cloner div in variable   var linkcloner = $('<div class="link-cloner">cloner</div>');    // when mouse hover on hyperlink   $('.link').on('mouseover', function() {      // append link-cloner class hyperlink     $(this).append(linkcloner);   }).mouseleave(function() {      //on mouse leave, remove link-cloner      $(linkcloner).remove();   }); /* ------------------------     part 2 — doesn't work   --------------------------*/   //then when click on appended linkcloner,    clone hyperlink , append #container   $(linkcloner).on('click', function() {    // code wrong....    event.preventdefault();   $('.link').clone().append('<li></li>').appendto('#container');    }); }); 

can lead me in right direction? javascript or jquery, either fine me (i'm learning both) :-)

you have done small mistake. replace part 2 below code :

$('.link').on('click', function(event) {    // code wrong....    event.preventdefault();   $(this).clone().append('<li></li>').appendto('#container');  }); 

Comments

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

reactjs - React router and this.props.children - how to pass state to this.props.children -

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -