html - Show hidden text on hover (CSS) -

i have tried while show text on :hover, able explain me?

i tried:

#divforhoveritem:hover #hiddentext {      display: block;} 

without luck, sadly. little piece in every example found.

i failed understand: https://css-tricks.com/forums/topic/show-text-on-hover-with-css/

i try <div id="divforhoveritem"><p>shown text</p></div>

<div id="hiddentext"><p>hidden text</p></div> 

css:

#hiddentext {    display: none; } 

and code line there ^

#divforhoveritem:hover #hiddentext {      display: block;} 

the #hiddentext element has inside #divforhoveritem element if want achieve css. try this:

#divforhoveritem {      /*just can see it*/      height: 50px;      width: 300px;      background-color: red;  }    #hiddentext {      display: none;  }    #divforhoveritem:hover #hiddentext {      display:block;  }

<div id="divforhoveritem">    <div id="hiddentext"><p>hidden text</p></div>  </div>

jsfiddle link convenience