CODEWITHSUNDEEP
javascriptphpjqueryhtmlcss
Benson Arafat
Benson Arafat

Reputation: 501

Hide a class from other class with the same name when clicked

An image is display to my webpage, all having the same class name. I try hiding a particular one with it is clicked but any time I click that particular class, all the classes are affected

I used PHP to echo the image to webpage. I have tried all I could but not working. 

<a href="#"><img class="media_image" onclick="hide()" src="media/<?php echo $media?>"/></a>


<script>
function hide(){
var divs = document.getElementsByClassName("media_image");
for(var i = 0; i <= divs.length; i++){
console.log("Item: ", i);
}
}
</script>

Upvotes: 4

Views: 264

Answers (2)

zakariya harti
zakariya harti

Reputation: 21

you could add a second special class to every image in the webpage like :

<img class="myimg img-1">
<img class="myimg img-2">
<img class="myimg img-3">
// ect

Upvotes: 1

Taplar
Taplar

Reputation: 24965

You can change onclick="hide()" to onclick="hide(this)" to pass the element into the function and then the function can be changed to accept it.

function hide (element) {
    //do whatever with element
    element.style.display = "none";
}

Upvotes: 2

Related Questions