Fairly new to jQuery and am running into an issue. Going to simplify it for clarity.

Let's say I have 3 tabs, all of which have a button with the same ID and a label with the same ID on them. When a user clicks the button on Tab 1, I want to reference the .html() from the label on Tab 1. When a user clicks the button Tab 2, I want to reference the .html() from the label on Tab 2. Etc, etc.

Is there an easy way to get this, or do I have to have unique IDs for each label/button to do it?

Thanks in advance.

EDIT: Adding code, here's my index.jsp with the existing tabs:

```
    <div id="tabs">
<ul>
<li>
<a href="${pageContext.request.contextPath}/your_searches" id="tab1"><span>My Searches</span></a>
</li>
<li>
<a href="${pageContext.request.contextPath}/public_searches" id="tab2"><span>Public Searches</span></a>
</li>
<li>
<a href="${pageContext.request.contextPath}/new_search" id="tab3"><span>New Search</span></a>
</li>

<li>
<a href="#tabs-4"  id="tab4">View Article</a>
</li>

</ul>

<div id="tabs-1"></div>
<div id="tabs-2"></div>
<div id="tabs-3"></div>
<div id="tabs-4"> <%@include file="view_article2.jsp"%></div>

</div>

<div id="dialog"                     title="Alert!"></div>
<div id="editDialog"                 title="Alert!"></div>
<div id="editDialogYourSearch"       title="Alert!"></div>
<div id="updateSearchCriteriaDialog" title="Alert!"></div>

```

The jQuery that exists is fairly complex, but adds a tab on a click event using this:

```
$("#" + tabId).load($("#context").val() + '/resources/templates/searchResultsTemplate.html', function () {

var html = $("#" + tabId).html();
$("#" + tabId).html(html.replace(/#tabId#/g, tabId));

var headlnTrEnabled = data.searchResults.searchVO.headlnTrEnabled;
var docTrEnabled    = data.searchResults.searchVO.docTrEnabled;
var languageName    = data.searchResults.searchVO.languageName;

if(headlnTrEnabled == 0) {
        document.getElementById("translated-" + tabId ).disabled=true;
        $("label[for='translated-" + tabId + "']").text("Language translation is unavailable for '" + languageName + "'");
}

// Process the click event on the 'translated' checkbox
processTranslationSupportedCheckboxEvents( tabId );

//alert("new_search queryAndPopulateArticlesSearchResults: before populateResultsPageSearchCriteria");
// Set Search Criteria value in Search Results' hidden fields
populateResultsPageSearchCriteria( data.searchResults, tabId );

// Initialize DataTable
initDataTable( '#articleTable-' + tabId );

// Define double-click method on data rows
initArticleTableDoubleClick( '#articleTable-',
                                                         tabId,
                                                         data.searchResults.searchVO.languageCode,
                                                         "#error" );

// Populate Search Results UI from article list
// var counter = populateSearchResultsTable( tabId, data.searchResults.articleList );
checkHighlight();

$('#searchInfo').html( data.hash );

```

On these added tabs (searchResultsTemplate.html) is where I'd need to reference the labels from a button click. Here's the simplified HTML I have thusfar:

```
<input type="checkbox" id="translated-#tabId#"/><label for="translated-#tabId#">Translate Article Titles</label>

<div align="right"><input type="button" value="Export Excel CSV File.." id="exp-csv" />
<br>
<label id="DownloadLink"></label>
</div>

<input id = "btnSubmit" type="submit" value="Release"/>

<p id="searchTitle-#tabId#" name="searchTitle"></p>

<label id="searchInfo">None</label>

```

The #exp-csv button needs to reference the #searchInfo label on the currently selected tab.