JSFiddle - React, Tailwind, and code Playground

HTML

<div id="ListeMot" >
<input name="Action" id="Action" type="button" onClick="$();"value="Action" /><br>
</div>
<div id="ListeMot2" ></div>

JavaScript

let jObjListeMot = $( "#ListeMot" );
let jObjListeMot2 = $( "#ListeMot2" );
 
$( "#Action" ).one( "click", function( ev ){
jObjListeMot.append(
  '<span class="clickable">Mot1 </span>',
  '<span class="clickable">Mot2 </span>',
  '<span class="clickable">Mot3 </span>',
  '<span class="clickable">Mot4 </span>',
  '<span class="clickable">Mot5 </span>',
  '<span class="clickable">Mot6 </span>'
);
 
$( "body" ).on( "click", ".clickable", function( ev ){ 
  console.log( ev.target );
});
 
$( ".clickable" )
.each(function(i){
	$(this)
	.clone( true, true )
	.attr("id","ID"+(i+1))
	.appendTo( jObjListeMot2 );
});
 
$(".clickable").on( "click", function( ){
  alert($(this).attr("id"));
});
 
 
});