jQuery 'hiding' content on search output page

[Subyne Simean]

Hello I was wondering if you may be able to help with this problem.

I have a PHP search results output page. In the search results I want to have a copy button next to some of the results so users can easily copy them to their clipboard.

The jQuery I'm using only works when I output the following script along with the results (i.e. it won't work if I just have it on the page statically).

$('.copy').click(function() {
    
    var row = $(this).closest('td');

    
    var txt = row.find('span:first');

    
    window.clipboardData.setData('Text', txt.text());

    
    var range = document.body.createTextRange();
    range.moveToElementText(txt[0]);
    range.select();
});

the HTML...

<td><span>Name from DB here</span> <button class="copy">COPY</button></td>

<td><span>Phonefrom DB here</span> <button class="copy">COPY</button></td>

<td><span>Email from DB here</span> <button class="copy">COPY</button></td>

So yes it works if I do it that way, but everything above the script gets hidden (behaves like the elements have display: none set). I have a form above the script that needs to be on the page.

Please help!!!

[VIPStephan]

I don’t see anything that would hide the content. Use a debugging tool (usually built into the browser already) and see what really happens. Also, you are adding a “DOM ready” function to your script or loading it at the end of the document, aren’t you?