Come visualizzare: nessuno tra genitori e fratelli tag quando si utilizza Mostra di più Mostra meno Jquery

Question

mio markup è configurato in questo modo:

<div class="media-body" > 
    <h5 class="media-heading"> 
     <strong id="head">{{$blog->Title}}</strong> 
     <strong id="head2">{{$blog->Title}}</strong> 
    </h5> 
    <button id="hide">Hide</button> 
    <button id="show">Show</button> 
</div> 

ho 2 pulsanti utilizzando jQuery per mostrare e nascondere (che fungono da mostra altro mostra di meno) i due tag all'interno del mio tag h5. Tuttavia non riesco a utilizzare questo codice per garantire che il tag forte con sia non visualizzazione. Ho provato

<style> 

.head2 
display:none; 

</style> 

Ho anche provato

<style> 

strong.head2 
display:none; 

</style> 

Im sicuro se questo ha qualcosa a che fare con jQuery in modo ive incollato che in seguito per ogni evenienza.

codice jQuery:

$(document).ready(function(){ 
    $("#head").html(function(i, h) { 
    var words = h.split(/\s/); 
    return words[0] + ' <span>' + words[1] + ' </span>' +' <span>' + words[2] + ' </span>'; 
}); 
}); 
$(document).ready(function(){ 
$("#hide").click(function(){ 
    $("#head2").hide(); 
}); 

$("#show").click(function(){ 
    $("#head2").show(); 
}); 
$("#hide").click(function(){ 
$("#head").show(); 
}); 

$("#show").click(function(){ 
    $("#head").hide(); 
}); 
}); 

Answer 1

ci si rivolge una classe di .head2 nel CSS, ma hanno un id. Utilizzare invece un selettore id #. Per esempio ...

<strong id="head2">{{$blog->Title}}</strong> 

---

#head2 { 
    display:none; 
} 

Vedi CSS Selector Reference per ulteriori informazioni