JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.iconmonstr.com/1.3.0/css/iconmonstr-iconic-font.min.css">
<input type="text" class="aai_url_name" placeholder="Add link" value="link1"></input><input type="text" class="aai_url_link" placeholder="Link name" value="www.google.fr"></input>
<div class="newUrl_list">
				
				</div>

JavaScript

var UrlName = $(".aai_url_name").val();
	  	var UrlLink = $(".aai_url_link").val();
			
if (UrlName !== "" && UrlLink !== "") {
 var addHttp = $(".aai_url_link").val("http://" + UrlLink);
		  var HttpUrlLink = addHttp.val();
	function calcurllink(){
					var nburlli = $('.url_link').length;
					if(nburlli >= 1){ return nburlli; }else{return '';}
			}
	$(".newUrl_list").prepend(
			  '<span class="url_link"><a target="_blank" href="' +
				HttpUrlLink +
				'">' +
				UrlName +
				' </a><span class="url_remove" data-nburl="urllinkref'+ calcurllink() +'"><i class="im im-x-mark"></i></span></span><input type="hidden" class="urllinkref'+ calcurllink() +'" name="urllinkhref'+ calcurllink() +'" value="'+ UrlLink +'"><input type="hidden" class="urllinkref'+ calcurllink() +'" name="urllinkname'+ calcurllink() +'" value="'+ UrlName +'">'
			);
			
}
//I want to delete the two input generated. I can't select them
$(document).ready(function() {
	$('.newUrl_list').on("click", ".url_remove", function () {
		var refurllink = $(this).data("nburl");
		var test = $('input[type=hidden]').attr('class');

			var allclasssameurl = $("." + refurllink);
			for(var i = 0; i < allclasssameurl.length; i++){
					$(allclasssameurl[i]).remove();
			}
	  	$(this).parent().remove(); 
	}); // Delete link
});