通过子元素获取Div

Question

I have the following code

<div id="faqEntries">
    <p:inputText disabled="true" class="telDialogField"></p:inputText>
    <br/>
    <p:inputTextarea disabled="true" class="telDialogField"></p:inputTextarea>
    <br/>
    <p:button value="In Ticket übernehmen" class=" telDialogButton"></p:button>
</div>

this part is for showing faq entries from a database. This part is nested inside of a ui:repeat.

what I want to do now is get the surrounding Div when I click the button, so that I can get the Textarea afterwards and copy this text to an other TextArea. Normaly I would just try to do this using id Tags but this does not seem to work with the ui:repeat.

I know how I can copy the content into another textarea but not how to get the first textarea.

Answer 1

There are two ways.

Pure Javascript:

var pDoc = document.getElementById("yourDiv");
var parentDiv = pDoc.parentNode;

Using Jquery:

var parentDiv = $("#yourDiv").parent()

Answer 2

You can get the parent element by using .parentElement property.

<div id="faqEntries">
    <p:inputText disabled="true" class="telDialogField"> 
    </p:inputText>
    <br/>
    <p:inputTextarea disabled="true" class="telDialogField"> 
    </p:inputTextarea>
    <br/>
    <p:button onclick="foo(this.parentElement);" value="In Ticket übernehmen" class=" telDialogButton"> 
    </p:button>
</div>

The foo() function can then do whatever you wish with the parent element.

function foo(parent){
    alert(parent.nodeName);
}