CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user8965201
user8965201

Reputation:

Is it possible to change a style of a div that doesn't have id or class using jquery or javascript?

I want to change a style of a div but the div i'm trying to change doesn't have an id or class. Can someone please help?

This is the div that I want to change:

<div style="display:inline-block">

I expect the result to be something like:

$('#ID/.Class').css({'display': 'block'});

The result I want to get is:

<div style="display:block">

If you could help me that would be great!
If it is impossible by JQuery please tell me how to do it by Javascript (If you tell me how to do it by Javascript please tell me the full javascript so that I could paste it into my code) Thanks!

Upvotes: 1

Views: 198

Answers (2)

Carl Edwards
Carl Edwards

Reputation: 14434

This could easily be done in jQuery by targeting the div's style attribute, to see that it has the value of inline-block anywhere in it via *. If only one of these divs is needed, you also use first() followed by css() to change the style.

$("div[style*='inline-block']").first().css('display', 'block');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div style="display: inline-block;">Example div</div>

The native JS solution is almost identical, only you use querySelector(): 

document.querySelector("div[style*='inline-block']").style.display = 'block';
<div style="display: inline-block;">Example div</div>

Upvotes: 1

user7207170
user7207170

Reputation:

Here is the Jquery version to filter the div tags that has the inline style of display:inline-block and then change its CSS to display:block. You can use Inspect element to check the output. Hope it helps. 

$("div").filter(function(){
return ($(this).css('display') == 'inline-block');
}).css("display","block");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="display:inline-block">Text</div>

Upvotes: 0

Related Questions