[ACCEPTED]-How to get this element using jQuery selectors?-dom

Accepted answer

Score: 10

I don't know why there are so many answers 13 that you are using XPath because XPath was 12 deprecated a long time ago and jQuery no 11 longer supports it without the XPath compatibility 10 plugin.

See Release Notes of 1.2 : http://www.learningjquery.com/2007/09/upgrading-to-jquery-12

XPath 9 compatibility plugin : http://docs.jquery.com/Release:jQuery_1.2#XPath_Compatibility_Plugin

Just use $("#colorSwatchContent span") as your 8 selector. Which is a css style seclector 7 meaning find me all descendent span elements 6 of an element with id colorSwatchContent. Since 5 id's in html are unique identitfiers, this 4 is about as specific as you can get.

$("#colorSwatchContent > span") will 3 only select DIRECT descendents (immedieate 2 children)

$("#colorSwatchContent > span:first") will select the first span direct 1 descendent

Score: 1

In order to grab one specific element when 15 there are many that match you should give 14 the elements classes, for example give each 13 table a class describing what is in it, then 12 give each tr a class describing what the row 11 is about. Then each td with a class describing 10 the specific part of the row that it describes, for 9 example:

<table class="person">
    <tr class="john-doe">
        <td class="name">John Doe</td>
        <td class="phone-numbers">
            <table class="phone-numbers">
                <tr class="cell-phone">
                    <th class="label">Cell Phone:</th>
                    <td class="number">555-1234</td>
                </tr>
                <tr class="home-phone">
                    <th class="label">Home Phone:</th>
                    <td class="number">555-1234</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

Once you have your elements properly 8 described then you can use CSS style selectors 7 in jQuery. for example getting just the 6 td that has the home phone would be as simple 5 as doing:

$('table.person tr.home-phone td.number');

Hope this gets you heading the 4 right way.

One thing to note tho, If you 3 have incredibly complex table structures 2 you might want to rethink whether it needs 1 to be in a table or not.

Score: 0

tr[5] doesn't mean there are 5 trs (there 7 could be 10!), it means that it is selecting 6 the 5th one.

It looks to me like you are 5 using an XPath selector to get your elements... which 4 jQuery supports.

if you have control of the 3 HTML, the easiest way to select a specific 2 element is to give it an id... which in 1 your first example,

HTML BODY #bodyContainer #mainContentContainer #mainContent #productContentRight #swatchContent #colorSwatchContent SPAN

is equivilant to

#colorSwatchContent SPAN

Score: 0

Since jQuery supports xpath you could use 4 firebug to get the specific xpath, and then 3 use that in jQuery.

Just browse the source 2 in firebug, right click any element, and 1 then choose copy xpath.

Source: stackoverflow.com

[ACCEPTED]-How to get this element using jQuery selectors?-dom

window.getSelection return html

Fast way to dynamically fill table with data from JSON in JavaScript

Reload CSS stylesheets with javascript

Adding custom CSS classes to dynamically-created elements with jQuery

Finding line-wraps

How to return value from child window to parent window using window.open in Javascript?

Get all elements with `position:fixed` in an HTML page?

Chrome extension to change DOM with a button in extension popup

Replace function only works once (javascript)

How to detect if click event has been triggered by 'Enter'?