I have the following html code:

2. <ul data-role="listview" data-inset="true" id="searches">
3.   <li class="swipe">
4.     <a href="index.php?name=value" class="search" id="search1">
5.        Example Search #1
6.     </a><a href="#companySearch" class="editSearch" data-transition="slideup" data-icon="gear"></a>
7.   </li>
8.   <li class="swipe">
9.     <a href="index.php?name=value" class="search" id="search2">
10.        Example Search #2
11.     </a><a href="#companySearch" class="editSearch" data-transition="slideup" data-icon="gear"></a>
12.   </li>
13. </ul>

Then I have the following jquery code:

1. $(document).on('tap', '.editSearch', function(e) {
2.       // Trying to get the id of the previous element when the edit button is pressed
3.       alert($(this).prev().attr('id').toString());
4.       // Do some other stuff based on id I am trying to get ^here^
5. });

So for example, if I click on the gear link button that is in the first list item, this should send an alert to the screen saying the id is "search1", but instead it is undefined.  Basically, the attr() function in this case is ignoring the attributes I have set.  If I change the attr('id') to attr('class'), it will show classes "ui-btn-inner ui-li ui-li-has-alt ui-corner-top" which I'm assuming is assigned automatically since I have two links in one list element, but once again the class "search" which I assigned, is not included in the result.  Am I doing something wrong?  Any suggestions would be greatly appreciated.