Get paragraph text inside an element

Question

I want to have the text value from a     lt p gt  inside a     lt li gt  element    html    lt ul gt     lt li onclick  myfunction    gt       lt span gt  lt  span gt       lt p gt This Text lt  p gt     lt  li gt   lt  ul gt    javascript   function myfunction       var TextInsideLi    the result of this has to be the text inside the paragraph        How to do this

User · Answer

If you use eg   id  you can do it this way    x000D   x000D      function     x000D      let x   document getElementById  idName    x000D      let y   document getElementById  liName    x000D       x000D      y addEventListener  click   function e    x000D          y appendChild x   x000D          x000D   x000D     x000D        x000D   lt html lang  en  gt  x000D   x000D   lt head gt  x000D       lt title gt  lt  title gt  x000D       lt meta charset  UTF-8  gt  x000D       lt meta name  viewport  content  width device-width  initial-scale 1 0  gt  x000D   lt  head gt  x000D   x000D   lt body gt  x000D       lt p id  idName  gt TEXT lt  p gt  x000D       lt ul gt  x000D           lt li id  liName  gt  x000D   x000D           lt  li gt  x000D       lt  ul gt  x000D   lt  body gt  x000D   lt script src  js scripts script js  gt  lt  script gt  x000D   x000D   lt  html gt  x000D   x000D   x000D

User · Answer

Alternatively  you can also pass the li element itself to your myfunction function as shown   function myfunction ctrl      var TextInsideLi   ctrl getElementsByTagName  p   0  innerHTML      and in your HTML   lt li onclick  myfunction this   gt

User · Answer

Use jQuery      li   find  p   html     should work

User · Answer

Do you use jQuery  A good option would be  text      p   text

User · Answer

lt  DOCTYPE html gt   lt html lang  en  gt   lt head gt       lt meta charset  UTF-8  gt       lt title gt Where to JavaScript lt  title gt       lt  -- JavaScript in head tag-- gt       lt script gt          function changeHtmlContent                 var content   document getElementById  content   textContent              alert content                  lt  script gt   lt  head gt   lt body gt       lt h4 id  content  gt Welcome to JavaScript  lt  h4 gt       lt button onclick  changeHtmlContent    gt Change the content lt  button gt   lt  body gt      Here  we can get the text content of h4 by using   document getElementById  content   textContent

User · Answer

HTML    lt ul gt     lt li onclick  myfunction this   gt       lt span gt  lt  span gt       lt p gt This Text lt  p gt     lt  li gt   lt  ul gt     JavaScript   function myfunction foo        var elem   foo getElementsByTagName  p        var TextInsideLi   elem 0  innerHTML

User · Answer

Add an Id property into the P tag with value like text or something  function gettext         var amount   document getElementById  text   value

User · Answer

Try this    lt li onclick  myfunction this   gt   function myfunction li        var TextInsideLi   li getElementsByTagName  p   0  innerHTML      Live demo

User · Answer

change your html to the following    lt ul gt       lt li onclick  myfunction    gt           lt span gt  lt  span gt           lt p id  myParagraph  gt This Text lt  p gt       lt  li gt   lt  ul gt    then you can get the content of your paragraph with the following function   function getContent         return document getElementById  myParagraph   innerHTML

[javascript] Get paragraph text inside an element

Examples related to javascript

Examples related to html

Examples related to paragraph