Odnoszenie się do różnych danych z konkretnego diva

Mam pewien problem. Nie wiem jak się odwołać poprzez JS / JQuery do konkretnych elementów tego formularza. Divy robione są dynamicznie i ich ilość nie jest niczym ograniczona. Mogę mieć 50 tych samych divów, czyli takich samych formularzy (zmienia się tylko id pól).

<div id="url">
    <form>
	 <p>Nazwa <input class="nameUrl" id="${submenu.id}" value="${submenu.menuTitle}"/></p>
	 <p>Adres URL <input class="adrUrl" id="${submenu.id}" value="${submenu.menuUrl}"/></p><br />
    </form>
    <button>Usuń</button>
    <button id="${submenu.id}" class="updateUrl">Aktualizuj</button>
</div>

Napisałem taką oto funkcję:

$(document).ready(function() {
	$('.updateUrl').click(function() {
		if($(this).attr('id') == $('.nameUrl').attr('id')) {
			var id = $('.nameUrl').attr('id');
			var name = $('.nameUrl').attr('value');
			var url = $('.adrUrl').attr('value');
			
			alert("id: "+ id+ " name: " + name + " url: " + url);
		}
	});
});

Ale niestety zawsze odwołuje mi się tylko do jednego elementu... Z którego diva guzika bym nie kliknął to zawsze prześle mi dane z pierwszego od góry diva...

Reasumując: jak zrobić aby klikany button na konkretnym divie odnosił się do danych z tego samego diva, a nie innego?

Nadajesz to samo ID 3 elementom. ID jest unikalne i można go użyć tylko raz.

A Twój kod JS nie ma większego sensu, dlatego nie działa.

<div class="url">
    <form>
         <p>Nazwa <input class="nameUrl" id="${submenu.id}" value="${submenu.menuTitle}"/></p>
         <p>Adres URL <input class="adrUrl" value="${submenu.menuUrl}"/></p><br />
    </form>
    <button>Usuń</button>
    <button class="updateUrl">Aktualizuj</button>
</div>

$(document).ready(function() {
        $('.updateUrl').click(function() {
                var div = $(this).closest('div.url'); // znajduje najbliższego przodka z pasującym selektorem
                var id = div.find('.nameUrl').attr('id'); // od tegoż przodka, czyli diva, szukamy interesujących nas wartości
                var name = div.find('.nameUrl').val();
                var url = div.find('.adrUrl').val();
 
                alert("id: "+ id+ " name: " + name + " url: " + url);
                }
        });
});