Using jquery how do I detect if there is nothing before a certain html element and set a css rule if the result is positive?

I have a dynamically generated code that looks like this:

<div class="qty col-xs-12 col-sm-12 col-md-12 col-lg-12 no-padding">
				                <input type="hidden" value="42" name="product_id">
				
						
			
				<button style="font-family:open_sansbold; margin-left: 12px; padding-bottom: 12px; padding-top: 14px" class="btn btn-default" data-loading-text="In caricamento..." id="button-quote" type="button">RICHIEDI UN APPUNTAMENTO O PREVENTIVO SENZA IMPEGNO</button>
			
									  <button onclick="wishlist.add('42');" title="" class="btn btn-default" data-toggle="tooltip" type="button" data-original-title="Metti in lista dei desideri">
			  <img src="image/catalog/heart.png"></button>
			  		
            </div>

Open in new window


What I need to know is if that button has nothing before it (except that hidden input) inside it's div container. If this is so then I need to forcibily set it's margin-left to 0!important;

thanks
badwolfffAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Julian HansenCommented:
You can do it like this with JQuery
<script src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript">
$(function() {
  if($('#button-quote').prev().is('input')) {
    $('#button-quote').css({marginLeft: '0'});
  }
});
</script>

Open in new window

The !important is a bit tricky though. Two things
1. Consider why you are using important
2. Consider using a class to apply the style
For instance
.important-margin {
  margin-left: 0 !important;
}
...
// JQuery changes to
 $('#button-quote').addClass('important-margin');

Open in new window


Sample here

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
badwolfffAuthor Commented:
Noooooooooooo! Got it wrong! Sorry!

Sometimes other than that input there are other elements too (always) before that hidden input.
If that is so then we should not reduce the margin.
It should only happen IF AND ONLY IF the only element before the button is that hidden div.

I had to remove this code as it's messing up all other pages on my site where there are other elements before the hidden input.
Julian HansenCommented:
It should only happen IF AND ONLY IF the only element before the button is that hidden div
By Hidden Div do you mean hidden input?
I had to remove this code as it's messing up all other pages on my site where there are other elements before the hidden input.
So your question is how to set the margin when there is only one sibling before the button and it must be a hidden input?

If so - then all you need to do is check that the index of the button is == 1 like so
$(function() {
  var button = $('#button-quote');
  if(button.prev().is('input') && button.index() == 1) {
    $('#button-quote').css({marginLeft: '0'});
  }
});

Open in new window

Sample updated
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.