How can I pass a jQuery element to a JavaScript function without an id?

Question

html:

<div class="myClass">abc</div>
<div class="myClass">def</div>
<div class="myClass">ghi</div>
<div class="myClass">jkl</div>
<div class="myClass">mno</div>

jquery:

$('.myClass').on('click',function() {
    // do stuff in jQuery ...
    // also select text using a pure JavaScript function like so:
    selectElementText(el);
    // obviously a `$(this)` won't work.
    // A `document.getElementById('myId')` will work, but I don't know how to get it
});

javascript select text function (via https://stackoverflow.com/a/2838358/834525):

function selectElementText(el, win) {
    win = win || window;
    var doc = win.document, sel, range;
    if (win.getSelection && doc.createRange) {
        sel = win.getSelection();
        range = doc.createRange();
        range.selectNodeContents(el);
        sel.removeAllRanges();
        sel.addRange(range);
    } else if (doc.body.createTextRange) {
        range = doc.body.createTextRange();
        range.moveToElementText(el);
        range.select();
    }
}

How can I pass a document element to this function?

Can you also show the element whos text you want to select? Or is it the element the user just clicked? If so, @A.Wolff's suggestion is exactly what you need. — d4rkpr1nc3, Mar 21 '14 at 15:32
`obviously a $(this) won't work` - actually, it will (but all you need to pass is `this`) — andyb, Mar 21 '14 at 15:32
@A.Wolff comes to the rescue again! Truth be told I just figured it out as I hit refresh, but you got it submitted before then. — Ryan, Mar 21 '14 at 15:50

score 3 · Answer 1 · answered Mar 21 '14 at 15:31

3

Using the document keyword:

 selectElementText(document, window);
                     ^         ^        
                     ^          --- the window as in case of the function (optional)
                     ^--- the document as an argument which you want to pass

EDIT:

Thanks to @A. Wolff, it should be selectElementText(this);

answered Mar 21 '14 at 15:31

Gaurang Tandon

6,504
11
47
84

2

My first thought reading `document element` in question, but then doesn't make sense regarding function code – A. Wolff Mar 21 '14 at 15:32
@A.Wolff Now that I look more carefully, I see you are right. Editing. – Gaurang Tandon Mar 21 '14 at 15:35

score 3 · Accepted Answer · answered Mar 21 '14 at 15:53

3

You should use:

selectElementText(this);

To pass DOM node as parameter to selectElementText() function. ;)

answered Mar 21 '14 at 15:53

A. Wolff

74,033
9
94
155

score 0 · Answer 3 · answered Mar 21 '14 at 15:53

0

Just use this, instead of $(this) Like so: selectElementText(this);

answered Mar 21 '14 at 15:53

SAL

834
1
8
16

How can I pass a jQuery element to a JavaScript function without an id?

3 Answers3