jeudi 17 mars 2016

find "li" after Math.random() in jQuery

DEMO

Hi,

I am finding the Random Number of "LI", now Iam not able find content inside of selected Random Number.,

kindly help find the inner content, not sure how to find the content by keeping random selected value.

Appreciate your help!!

Thanks

JS: 

$(function(){

   getRandomMaxCount = $('#flexslider-1 .flex-viewport ul.slides li').length;
   var minNumber = 1;
   var maxNumber = getRandomMaxCount;
   randomNumberFromRange(minNumber, maxNumber);

   function randomNumberFromRange(min,max) {
        alert(Math.floor(Math.random()*(max-min+1)+min));
        console.log($(this).find('li'))
   }

})



HTML : 

<div id="flexslider-1" class="flexslider flexslider-processed">
   <div class="flex-viewport" style="overflow: hidden; position: relative;">
      <ul class="slides" style="width: 400%; transition-duration: 0s;">
         <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>


          <li class="flex-active-slide" style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315806--2" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d1png-2">d1.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1pvD11d" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/karthikeyan">Karthikeyan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75666</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
         <li style="width: 0px; float: left; display: block;">
            <div class="doctor-profile ">
               <div class="thumb-img">
                  <div class="field-content">
                     <div id="file-315811--3" class="file file-image file-image-png">
                        <h2 class="element-invisible"><a href="/file/d3png">d3.png</a></h2>
                        <div class="content">
                           <img typeof="foaf:Image" src="http://ift.tt/1ppxpF5" alt="" draggable="false">  
                        </div>
                     </div>
                  </div>
               </div>
               <div class="dr-name contact-name"><span class="field-content"><a href="/ashraf-jahan">Ashraf Jahan</a></span></div>
               <div id="doc_id" style="display:none;"><span>75661</span></div>
               <p class="dr-description"></p>
               <div></div>
               <p></p>
            </div>
         </li>
      </ul>
   </div>
   <ul class="flex-direction-nav">
      <li><a class="flex-prev flex-disabled" href="#" tabindex="-1">Previous</a></li>
      <li><a class="flex-next" href="#">Next</a></li>
   </ul>
</div>




Aucun commentaire:

Enregistrer un commentaire