Bsrgvty

Why did the Government cancel Saturday's Brexit-deal vote?

Regarding asking for writing about some courses in my CV in which I got bad grades due to my non interest in those courses

Why are so many cities in the list of 50 most violent cities in the world located in South and Central America?

Can I still travel on the Troika Card even if it goes into a negative balance?

Sci-fi book trilogy about space travel & 'jacking'

What are the Advantages of having a Double-pane Space Helmet?

What's a good strategy for offering low on a house?

Will there be a vote in the Commons to decide the fate of Johnson's deal?

Why the job's next_run_time is wrong?

Transforming the first Bell state into the other Bell states

Surjection from one string to two strings

What game(s) does Michael play in Mind Field S2E4?

What is more proper notation in piano sheet music to denote that the left hand should be louder?

Does the FIDE 75-move rule apply after checkmate or resignation?

Are there any spells that aren't on any class's spell list?

How can I list all flight numbers that connect two countries (non-stop)?

Intuition behind the paradox of instantaneous heat propagation

70 million rials in usurious money

Why did the people of Zion never find evidence of the previous cycles?

ignoring potentiometer value variations

why we need self-synchronization?

Iterator for traversing a tree [v2]

iPhone 11 - Leave lock screen after FaceId

Multiple devices with one IPv6 to the Internet?

Get index of visible element in jquery

Count li elements that are visible with jQueryIs there an “exists” function for jQuery?How do I detect a click outside an element?How do I check if an element is hidden in jQuery?How can I know which radio button is selected via jQuery?Creating a div element in jQueryHow can I select an element with multiple classes in jQuery?event.preventDefault() vs. return falseGet selected text from a drop-down list (select box) using jQueryHow do I remove a particular element from an array in JavaScript?jQuery scroll to element

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty
margin-bottom:0;

6

I want to get index of selectedclass between visible elements in jquery.

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

I have tried these ways

console.log($('ul li.selected').index());
console.log($('ul li:visible.selected').index());

I want the number 3 for the example above: The index of the .selected element in the ul ignoring the elements that aren't visible.

javascript jquery

share|improve this question

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  You can determine if your elem has a certain CSS style with ($('li#myId').css('display') == 'none'), same with class using hasClass
  
  – Alicia
  Jun 2 at 9:57
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  What are you expecting as both of those lines output 6 which is the index of the li containing 'element 07'?
  
  – Calum
  Jun 2 at 10:03
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It's not clear what you're asking for. Why "between visible elements"? What number are you expecting? 6? 3?
  
  – T.J. Crowder
  Jun 2 at 10:06
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  I expect the number 3 to return @T.J.Crowder
  
  – Mahdi Bashirpour
  Jun 2 at 10:08
  
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Sorry, question wasn't totally clear. But what I meant was, presuming you already know how to use index(), you can then just use hasClass/ css with that, should work fine
  
  – Alicia
  Jun 2 at 10:10
  

  
  
  
  

 | 
show 1 more comment

6

I want to get index of selectedclass between visible elements in jquery.

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

I have tried these ways

console.log($('ul li.selected').index());
console.log($('ul li:visible.selected').index());

I want the number 3 for the example above: The index of the .selected element in the ul ignoring the elements that aren't visible.

javascript jquery

share|improve this question

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  You can determine if your elem has a certain CSS style with ($('li#myId').css('display') == 'none'), same with class using hasClass
  
  – Alicia
  Jun 2 at 9:57
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  What are you expecting as both of those lines output 6 which is the index of the li containing 'element 07'?
  
  – Calum
  Jun 2 at 10:03
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It's not clear what you're asking for. Why "between visible elements"? What number are you expecting? 6? 3?
  
  – T.J. Crowder
  Jun 2 at 10:06
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  I expect the number 3 to return @T.J.Crowder
  
  – Mahdi Bashirpour
  Jun 2 at 10:08
  
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Sorry, question wasn't totally clear. But what I meant was, presuming you already know how to use index(), you can then just use hasClass/ css with that, should work fine
  
  – Alicia
  Jun 2 at 10:10
  

  
  
  
  

 | 
show 1 more comment

I want to get index of selectedclass between visible elements in jquery.

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

I have tried these ways

console.log($('ul li.selected').index());
console.log($('ul li:visible.selected').index());

I want the number 3 for the example above: The index of the .selected element in the ul ignoring the elements that aren't visible.

javascript jquery

share|improve this question

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

console.log($('ul li.selected').index());
console.log($('ul li:visible.selected').index());

share|improve this question

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

share|improve this question

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

edited Jun 2 at 10:13

T.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

asked Jun 2 at 9:56

Mahdi BashirpourMahdi Bashirpour

3,70622 gold badges2323 silver badges5050 bronze badges

1 Answer
1

active

oldest

votes

6

You can use index on the result of selecting the visible elements, passing in the selected element (or a jQuery object containing it). index will find the index of the element within the jQuery set (the visible elements):

var index = $("ul li:visible").index($("ul li.selected"));

Live Example:

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

share|improve this answer

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

add a comment
 | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/4.0/"u003ecc by-sa 4.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f56413978%2fget-index-of-visible-element-in-jquery%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

6

You can use index on the result of selecting the visible elements, passing in the selected element (or a jQuery object containing it). index will find the index of the element within the jQuery set (the visible elements):

var index = $("ul li:visible").index($("ul li.selected"));

Live Example:

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

share|improve this answer

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

add a comment
 | 

6

You can use index on the result of selecting the visible elements, passing in the selected element (or a jQuery object containing it). index will find the index of the element within the jQuery set (the visible elements):

var index = $("ul li:visible").index($("ul li.selected"));

Live Example:

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

share|improve this answer

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

add a comment
 | 

You can use index on the result of selecting the visible elements, passing in the selected element (or a jQuery object containing it). index will find the index of the element within the jQuery set (the visible elements):

var index = $("ul li:visible").index($("ul li.selected"));

Live Example:

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

share|improve this answer

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

var index = $("ul li:visible").index($("ul li.selected"));

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

console.log($("ul li:visible").index($("ul li.selected")));

<ul>
 <li>element 01</li>
 <li style="display: none">element 02</li>
 <li style="display: none">element 03</li>
 <li style="display: none">element 04</li>
 <li>element 05</li>
 <li>element 06</li>
 <li class="selected">element 07</li>
 <li style="display: none">element 08</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

share|improve this answer

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges

answered Jun 2 at 10:11

T.J. CrowderT.J. Crowder

744k136136 gold badges13501350 silver badges14111411 bronze badges