html - jQuery toggle function for toggling specific div (and not all div with same class name.) -

प्रत्येक & lt; li & gt; & lt; / li & gt; में टॉगल और सामग्री वर्ग है अभी, जब मैं टॉगल पर क्लिक करता हूं, तो प्रत्येक सामग्री आइटम दिखाया जाता है। JQuery का उपयोग करना, मैं कैसे सुनिश्चित कर सकता हूं कि एक समय में केवल एक ही सामग्री प्रदर्शित की जाये?

  & lt; स्क्रिप्ट & gt; $ (दस्तावेज़) .ready (फ़ंक्शन () {var $ content = $ ("। सामग्री")। Hide (); $ ("। टॉगल")। पर ("क्लिक करें", फ़ंक्शन (e) {$ (this) .toggleClass ("विस्तारित"); $ content.slideToggle ();});}); & Lt; / स्क्रिप्ट & gt; & Lt; li वर्ग = "सेल" आईडी = "बार 1" & gt; & Lt; div id = "update1" & gt; & lt;? Php इको $ पोस्ट? & Gt; & lt; / div & gt; & Lt; div वर्ग = "टॉगल" id = "toggle1" & gt; & lt; / div & gt; & Lt; div id = "चेक" & gt; & lt; a href = "#" class = "चेक" आईडी = "चेक 1" & gt; पढ़ & lt; / a & gt; & lt; / div & gt; & Lt; div class = "upvote" & gt; & lt; a href = "#" वर्ग = "जैसे" id = "1" & gt; & lt; span class = "thumbsup" & gt; & lt; / span & gt; & Lt; / a & gt; & lt; / div & gt; & Lt; div वर्ग = "upvote" & gt; & lt; a href = "#" class = "like" id = "upvote1" & gt; & Lt; div id = "deletepost" & gt; & lt; a href = "#" id = "1" & gt; हटाएं & lt; / a & gt; & lt; / div & gt; & Lt; div वर्ग = "सामग्री" आईडी = "1" & gt; & lt; img src = "चित्र / balloon.jpg" & lt; / div & gt; & Lt; / li & gt;   
 संपादित करें:। सामग्री अगले भाषण नहीं है। टॉगल स्पष्टता के प्रयोजनों के लिए, मैंने कुछ डिव्स निकाल दिए जो कि। टॉगल और। सामग्री के बीच आते हैं।  
 धन्यवाद   
 
 
 बदलें  $ content.slideToggle ()   $ (this) .next ()। SlideToggle ()  यह मानते हुए कि  .content  हमेशा  .toggle   
 संपादित करें: चूंकि यह नहीं है, आप क्या कर सकते हैं  पोस्टिड  s का उपयोग करें मुझे लगता है कि इसे  id  को जोड़ने के बजाय  डेटा-पोस्टिड  विशेषता का उपयोग करना बेहतर होगा (या दोनों करें) ताकि आपको उसे पार्स करने की ज़रूरत नहीं है ID।  
  $ ("। सामग्री [डेटा-पोस्टिड =" + $ (यह) .डेटा ('पोस्टिड') + "]")। स्लाइडटॉगल ();